怎么样把这段内容的宽度调整为整个网页的宽度？代码如下：
<!DOCTYPEhtml><html><head><metahttp-equiv="Content-Type"content="text/html;charset=ut...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script type="text/javascript" src="jquery.js"></script>
<script src="jquery.timelinr-0.9.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$().timelinr()
});
</script>
</head>
<body id="introduction">
<body>
<div class="show"></div>
<script>
var browser_width = $(document.body).width();
$("div.show").css("width",browser_width);
$(window).resize(function() {
browser_width = $(document.body).width();
$("div.show").css("width",browser_width);
});
</script>
<div id="page">
<div class="demotips"><a href="index.html">演示一</a><a href="demo2.html">演示二</a><a href="demo3.html">演示三</a></div>
<div id="container" class="content clearfix">
<div id="timeline">
<ul id="dates">
<li><a href="#1900">1900</a></li>
<li><a href="#1944">1944</a></li>
<li><a href="#1950">1950</a></li>
<li><a href="#1971">1971</a></li>
<li><a href="#1999">1999</a></li>
<li><a href="#2001">2001</a></li>
<li><a href="#2011">2011</a></li>
</ul>
<ul id="issues">
<li id="1900">
<img src="images/1.png" width="256" height="256" />
<h1>1900</h1>
<p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, .</p>
</li>
<li id="1944">
<img src="images/3.png" width="256" height="256" />
<h1>1944</h1>
<p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odi.</p>
</li>
<li id="1950">
<img src="images/4.png" width="256" height="256" />
<h1>1950</h1>
<p>Donec s</p>
</li>
<li id="1971">
<img src="images/5.png" width="256" height="256" />
<h1>1971</h1>
<p>Do</p>
</li>
<li id="1999">
<img src="images/8.png" width="256" height="256" />
<h1>1999</h1>
<p>Do</p>
</li>
<li id="2001">
<img src="images/9.png" width="256" height="256" />
<h1>2001</h1>
<p>Do</p>
</li>
<li id="2011">
<img src="images/10.png" width="256" height="256" />
<h1>2011</h1>
<p>Do</p>
</li>
</ul>
<div id="grad_left"></div>
<div id="grad_right"></div>
<a href="#" id="next">+</a>
<a href="#" id="prev">-</a>
</div>
</div>
</body>
</html> 展开
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script type="text/javascript" src="jquery.js"></script>
<script src="jquery.timelinr-0.9.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$().timelinr()
});
</script>
</head>
<body id="introduction">
<body>
<div class="show"></div>
<script>
var browser_width = $(document.body).width();
$("div.show").css("width",browser_width);
$(window).resize(function() {
browser_width = $(document.body).width();
$("div.show").css("width",browser_width);
});
</script>
<div id="page">
<div class="demotips"><a href="index.html">演示一</a><a href="demo2.html">演示二</a><a href="demo3.html">演示三</a></div>
<div id="container" class="content clearfix">
<div id="timeline">
<ul id="dates">
<li><a href="#1900">1900</a></li>
<li><a href="#1944">1944</a></li>
<li><a href="#1950">1950</a></li>
<li><a href="#1971">1971</a></li>
<li><a href="#1999">1999</a></li>
<li><a href="#2001">2001</a></li>
<li><a href="#2011">2011</a></li>
</ul>
<ul id="issues">
<li id="1900">
<img src="images/1.png" width="256" height="256" />
<h1>1900</h1>
<p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, .</p>
</li>
<li id="1944">
<img src="images/3.png" width="256" height="256" />
<h1>1944</h1>
<p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odi.</p>
</li>
<li id="1950">
<img src="images/4.png" width="256" height="256" />
<h1>1950</h1>
<p>Donec s</p>
</li>
<li id="1971">
<img src="images/5.png" width="256" height="256" />
<h1>1971</h1>
<p>Do</p>
</li>
<li id="1999">
<img src="images/8.png" width="256" height="256" />
<h1>1999</h1>
<p>Do</p>
</li>
<li id="2001">
<img src="images/9.png" width="256" height="256" />
<h1>2001</h1>
<p>Do</p>
</li>
<li id="2011">
<img src="images/10.png" width="256" height="256" />
<h1>2011</h1>
<p>Do</p>
</li>
</ul>
<div id="grad_left"></div>
<div id="grad_right"></div>
<a href="#" id="next">+</a>
<a href="#" id="prev">-</a>
</div>
</div>
</body>
</html> 展开
2个回答
展开全部
你这个没有用整个大层把其它层包起来，全都是放在body里面，所以只能在body里面把你的宽度属性改成百分百就可以跟浏览器一样宽了，styles.css文件里面加入body{width:100%; }，而且你检查一下，你body的开头标签有两个，重复了（<body id="introduction"> <body> ）
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这个要在CSS里改。
在CSS里找一下 #page
在CSS里找一下 #page
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
