如何调整jQuery加载的内容的大小's使用CSS的加载方法

How to resize the content loaded by jQuery's load method using CSS

本文关键字:加载 方法 CSS 使用 何调整 调整 jQuery      更新时间:2023-09-26

我正在使用load方法在我的网站中加载一个网页。

// main.js
$(document).ready(function ()
{
    $("#content").html("<object data='http://tired.com/'>");
});
// index.html
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script src="scripts/main.js"></script>
    <style type="text/css">
#container{
    width: 100%;
    height: 100%;
}
#content{
    margin-top: 10;
    margin-left: 100;
    margin-bottom: 10;
    margin-right: 10;
    width: 500px;
    height: 500px;
}
    </style>
</head>
<title>
Testing loading a html page into a div
</title>
<body>
    <div id="container">
        <div id="top">
            <p> Top </p>
        </div>
        <div id="content">
        </div>
        <div id="bottom">
            <p> Bottom </p>
        </div>
    </div>
</body>
</html>

尽管contentdiv的高度和宽度为500px,但网页仍然以其原始大小加载。

我怎样把它做大?

谢谢。

它确实有效,检查一下这个小提琴。JSFiddle演示链接

您可能还想将px添加到您的页边距中。

#content{
    margin-top: 10px;
    margin-left: 100px;
    margin-bottom: 10px;
    margin-right: 10px;
    background:skyblue;
    width: 500px;
    height: 500px;
    padding:10px;
}

我建议尝试在对象标记本身上设置样式:

#content object {
    width: 500px;
    height: 500px;
}