css – 如何使主div容器对齐到中心

前端之家收集整理的这篇文章主要介绍了css – 如何使主div容器对齐到中心前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
大家好,

我一直在想知道其他人如何与主要的集装箱中心对齐,因为我迄今为止管理的唯一方法是将以下内容添加到css文件中:

* {
填充:自动;
保证金:汽车;
文本对齐:中心;
}

我看到其他页面使用:
* {填充:0像素;边缘:0像素}
但是我不能看到他们在做什么或做什么来集中主容器.

有人可以解释一下吗

代码示例:

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <Meta content="text/html; charset=windows-1252" http-equiv="Content-Type" />
  4. <title>This is the main container</title>
  5. <style type="text/css">
  6. *{
  7. padding:auto;
  8. margin:auto;
  9. text-align:center;
  10. }
  11. </style>
  12. </head>
  13. <body>
  14. <div style="width:400px;background-color:#66FFFF;display:block;height:400px;">
  15. <b>This is the main container.</b>
  16. </div>
  17. </body>
  18. </html>

任何人都可以在下面的页面中解释他们如何做?
http://www.csszengarden.com/?cssfile=/179/179.css&page=4

谢谢

解决方法

不要使用*选择器,因为这将适用于页面上的所有元素.假设你有一个这样的结构:
  1. ...
  2. <body>
  3. <div id="content">
  4. <b>This is the main container.</b>
  5. </div>
  6. </body>
  7. </html>

然后,您可以使用以下方式居中#content div:

  1. #content {
  2. width: 400px;
  3. margin: 0 auto;
  4. background-color: #66ffff;
  5. }

不知道你在别处见过什么,但这是要走的路. * {margin:0;填充:0;你看过的代码片段是为所有浏览器重置浏览器的默认定义,使您的网站在所有浏览器上的行为类似,这与集中主体无关.

大多数浏览器对某些通常与其他浏览器的实现不一致的元素应用默认边距和填充.这就是为什么通常被认为是聪明的使用这种“重置”.您提供的重置代码片段是最简单的重置样式表,您可以在此处阅读更多关于主题内容

> http://meyerweb.com/eric/tools/css/reset/

猜你在找的CSS相关文章