Amr*_*mra 19 html css alignment
我一直想知道其他人如何与主要div容器的中心对齐,因为我到目前为止管理的唯一方法是向css文件添加以下内容:
*{
padding:auto;
margin:auto;
text-align:centre;
}
Run Code Online (Sandbox Code Playgroud)
我看过其他页面使用过:*{padding:0px;margin:0px}
但是我看不到他们在哪里或者做了什么来集中主容器.
有人可以解释一下吗?
代码示例:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=windows-1252" http-equiv="Content-Type" />
<title>This is the main container</title>
<style type="text/css">
*{
padding:auto;
margin:auto;
text-align:center;
}
</style>
</head>
<body>
<div style="width:400px;background-color:#66FFFF;display:block;height:400px;">
<b>This is the main container.</b>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
有谁可以解释他们是如何在下一页中做到的?
Tat*_*nen 39
不要使用*
选择器,因为它将适用于页面上的所有元素.假设你有这样的结构:
...
<body>
<div id="content">
<b>This is the main container.</b>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
然后,您可以#content
使用以下内容对中心:
#content {
width: 400px;
margin: 0 auto;
background-color: #66ffff;
}
Run Code Online (Sandbox Code Playgroud)
不知道你在其他地方看到了什么,但这是要走的路.* { margin: 0; padding: 0; }
您看到的片段是重置所有浏览器的浏览器默认定义,以使您的网站在所有浏览器上的行为相似,这与主容器居中无关.
大多数浏览器对某些元素应用默认边距和填充,这些元素通常与其他浏览器的实现不一致.这就是为什么使用这种"重置"通常被认为是聪明的原因.您提供的重置片段是最简单的重置样式表,您可以在此处阅读有关该主题的更多信息:
归档时间: |
|
查看次数: |
200280 次 |
最近记录: |