CSSDIV固定宽度居中的方法

来源：动视网责编：小采时间：2020-11-27 16:41:29

CSSDIV固定宽度居中的方法

CSSDIV固定宽度居中的方法:DIV布局水平居中，关键使用CSS单词为margin:0 auto。解释：DIV对象外边距左右为自动适应距离（根据对象设置宽度样式自动判断浏览器除去设置宽度后剩下宽度左右自动对等自然就实现布局居中），上下间距为0px。关键实例CSS代码： body{ text-a

推荐度：

点击下载本文 文档为doc格式

导读CSSDIV固定宽度居中的方法:DIV布局水平居中，关键使用CSS单词为margin:0 auto。解释：DIV对象外边距左右为自动适应距离（根据对象设置宽度样式自动判断浏览器除去设置宽度后剩下宽度左右自动对等自然就实现布局居中），上下间距为0px。关键实例CSS代码： body{ text-a

DIV布局水平居中，关键使用CSS单词为margin:0 auto。
解释：DIV对象外边距左右为自动适应距离（根据对象设置宽度样式自动判断浏览器除去设置宽度后剩下宽度左右自动对等自然就实现布局居中），上下间距为0px。

关键实例CSS代码：

body{ text-align:center} 
.box{ margin:0 auto; width:500px; height:100px; border:1px solid #00F}

首先对body设置个css内容居中，当然也是为了兼容各大浏览器默认情况下内容为居中初始设置，如何再对需要居中的选择器设置布局居中(margin:0 auto)，固定宽度设置为500px，高度100px，CSS边框为1px蓝色实线边框。

这里设置500px宽度是任意设置，实际布局中根据需求设置，为了看到DIV被居中布局，所以加入高度和边框，以便观察到固定宽度居中实例效果。

实例：

 
 
 
 
CSS DIV 固定宽度居中的方法 
 
 
 
CSS DIV 固定宽度居中的方法

在线运行

CSSDIV固定宽度居中的方法

推荐度：

点击下载本文 文档为doc格式

标签：方法办法居中

热门焦点

CSSDIV固定宽度居中的方法

CSSDIV固定宽度居中的方法

CSSDIV固定宽度居中的方法

最新推荐

猜你喜欢

热门推荐