gpt4 book ai didi

html - 如何将我的网站居中?

转载 作者:可可西里 更新时间:2023-11-01 13:22:54 25 4
gpt4 key购买 nike

所以我想将我的网站居中,但我真的不知道该怎么做。我在 HTML 的容器 div 中尝试了 align="center" 但它没有用。

我的另一个想法是将页眉和页脚的宽度更改为 min-width 并且成功了。然后我尝试将中间列(col2)的width设置为min-width以使其展开。但它也不起作用,因为它对 col2 的宽度没有任何作用。将 float:right 添加到 col3 也不起作用。现在我不知道我应该做什么。

HTML

<!Doctype html>
<html>
<head>
<meta charset = "utf-8"></meta>
<title>Site</title>
<link rel = "Stylesheet" type = "text/css" href = "style.css">
</head>
<body>
<div id = "container" >
<div id = "header">header</div>
<div id = "col1" >col1</div>
<div id = "col2" >col2</div>
<div id = "col3" >col3</div>
<div id = "footer">footer</div>
</div>
</body>
</html>

CSS

body{
background-color: red;
}
#container{

}
#header{
width:1000px; /*min-width:1000px*/
background-color:white;
height:100px;
}
#col1{
width:300px;
height:100px;
background-color:white;
float:left;
}
#col2{
width:400px; /*min-width:400px;*/
height:100px;
background-color:blue;
float:left;
}
#col3{
width:300px;
height:100px;
background-color:white;
float:left; /*float:right; */
}
#footer{
clear:both;
background-color:white;
width:1000px; /*min-width:1000px; */
height:100px;
}

最佳答案

试试这个:

#container{

width: 100%;
max-width: 1000px;
margin: 0 auto;

}

关于html - 如何将我的网站居中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44096922/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com