Rumah >hujung hadapan web >html tutorial >这种情况如何让div居中?_html/css_WEB-ITnose

这种情况如何让div居中?_html/css_WEB-ITnose

WBOYasal: 2016-06-24 12:10:421217semak imbas

我的页面大体是:

总之最后生成的实际页面标签大体是:

...

我现在的问题就是这些个div的样式要怎么设置,才能让它在整个ul里处于居中位置啊??我试过了设置成margin:0 auto这种,但是不行,我之所以一定要用居中的样式,是因为想在所有大小的屏幕上都能居中显示,否则光靠调元素间距,屏幕大小一变就跑偏了

请教各位~~~~

回复讨论(解决方案)

ul下嵌套div元素不符合XHTML规范。ul是块级元素，设置固定的宽度值以后才能通过 margin:0 auto;样式进行居中。如果还需要对列表项进行“分组”以设置不同的样式，可以通过添加不同的样式类来实现，比如：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><style type="text/css">ul { margin:0 auto; width:200px; }li.listGroup1 { color:red; }</style><ul>  <li class="listGroup1">1</li>  <li class="listGroup1">2</li>  <li class="listGroup2">3</li></ul></body></html>

设置ul里边的样式：text-align:center也能看到效果。。。。

可是text-align貌似只对文本起效果

最后问题还是解决了，我要求是一行四列，我就每行弄了四个div宽度分别设为25%，然后把

放在里面，并设置margin:auto

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：BUG，解决不了。集思广益。_html/css_WEB-ITnoseArtikel seterusnya：<ol>为什么列表前面没有数字？请大侠门指教，谢谢。有源代码_html/css_WEB-ITnose

Artikel berkaitan

Lihat lagi