关于设置banner最外层div宽度的问题

来源：6-2 作业题

itstimetosail

2018-11-15 17:41:06

/*总体*/
*{
	margin:0;
	text-decoration:none;
	font-family:"Microsoft YaHei";
	color:#666;
	font-size:22px;
}
body{
	padding:10px;
	min-width:1020px;
	background-color:#eee;
}
/*标签*/
.tab{
	height:45px;
	padding-right:5px;
	text-align:center;
	border:1px dashed #eee;
	border-bottom:none;
	border-radius:5px;
	background-color:#fff;
}
.tab div,.active{
	margin-top:5px;
	margin-left:5px;
	width:24%;
	display:inline-block;
}
.tab .active{
	background-color:#FC0;
	border-radius:5px;
}
.tab a{
	line-height:40px;
}
/*图片*/
img{
	width:100%;
	display:none;
	float:left;
}

<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<title>carousel6-2</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="CSS/carousel6-2.css">
</style>
</head>
<body>
<div id="banner">
<!--标签-->
<div class="tab" id="tab">
    <div><a href="#">首页</a></div>
    <div><a href="#">点击看看</a></div>
    <div><a href="#">会自动的</a></div>
    <div><a href="#">我的网站</a></div>
</div>
<!--图片-->
<div class="img" id="img">
<img src="image/img1.jpg">
<img src="image/img2.jpg">
<img src="image/img3.jpg">
<img src="image/img4.jpg">
</div>
</div>
<script type="text/javascript" src="JS/carousel6-2.js"></script>
</body>
</html>

我一直很疑惑，因为大家的显示器各不相同，所以我都很纠结要怎么设置最外层容器的宽度。但是如果不设置，内容会根据窗口宽度自动适应，占满窗口，所以我就一般选择不设置宽度。

还有因为窗口大小可以调整，我希望内容也可以根据窗口的大小来自动调整，所以我一般会在选择在宽度设置的时候使用百分比，，，但是确实就会带来一些相应的问题。。emmmm，，我也不太知道我要表达的问题。。。。。。

大概就是很纠结要不要设置总体宽度以及如果要设置，设置多少合适吧，，

写回答

2回答