网页设计块状显示怎么弄(网页布局元素)

导语：网页中常见的不定宽度的块状元素居中问题剖析

在工作项目中经常会遇到需要为“不定宽度的块状元素”设置居中，例如网页上的分页导航，因为分页的数量是不确定的，所以我们不能通过设置固定的宽度来限死它。

下面就来说说要如何居中不定宽度的块状元素

一、设置元素的display: inline 方法

改变块级元素的 display 为 inline 类型了，设置为行内元素显示，再使用 text-align:center 来实现居中效果。

案例展示：

这种方法不用增加无语义标签，但也存在着一些问题：比如设定长度值。

二、加入 table 标签

给设置居中的元素外面加入一个 table 标签，然后给这个 table 设置“左右 margin 居中”

如下：

三、设置 position:relative 和 left:50%：利用 相对定位 的方式居中

通过给父元素设置 float，然后给父元素设置 position:relative 和 left:50%，子元素设置 position:relative 和 left: -50% 来实现水平居中。

案例：

这三种方法各有优缺点，具体选用哪种方法，可以看自己的情况而定！

本文内容由小若整理编辑！