用CSS控制:
方式一:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>宁夏短期天气预报</title>
<#include "/web/common/project/meta.ftl"/>
<style type="text/css">
.aa{
position: absolute;
top: 50%;left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
</style>
</head>
<body>
<p style="text-align: center;">宁夏短期天气预报</p>
<script type="text/javascript">
(function ($) {
}(jQuery));
</script>
<iframe class="aa" src="http://3g.nx121.com/pc/tqybnx.aspx" style="width:400px;height:400px;"></iframe>
</body>
</html>
方式二:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>宁夏短期天气预报</title>
<#include "/web/common/project/meta.ftl"/>
</head>
<body>
<p style="text-align: center;">宁夏短期天气预报</p>
<script type="text/javascript">
(function ($) {
}(jQuery));
</script>
<div style="width:400px;height:400px;margin:0px auto;">
<iframe src="http://3g.nx121.com/pc/tqybnx.aspx" style="width:400px;height:400px;margin:0px auto;"></iframe>
</div>
</body>
</html>
页面内容自适应浏览器宽度:
<script language="javascript">
//先获取到报表所在区域的页面元素,再通过document.body.clientWidth获得到浏览器的宽度,将该宽度值用于改变报表所在区域的样式宽度
function myResize() {
var tab1 = document.getElementById("sysReportIframe");
tab1.style.width=document.body.clientWidth;
}
window.onload=myResize;
window.onresize=myResize;
</script>