css布局的问题

Question

红字下的border线该怎么弄，如果设置了h1的宽度，元素就不会居中了，如果用绝对定位的话，感觉下面的布局要乱了。

Answer 1

H1:after

Answer 2

你也可以设定 h1 的宽度，然后 margin: /* A certain number for vertical margin */ auto 水平居中。

Answer 3

思路挺多啊，可以在h1外罩div，设置border-bottom；或者h1下方加个元素，构造划线。

其实你也只是想更方便点，更少代码，但有时还是简单通俗点好。

Answer 4

楼上已经有答案了，但是我比较好奇设置宽度为什么不能居中？

Answer 5

1、h1里面嵌套一层span标签；把你的文字放在span标签里面，span标签设置display: inline-block;
设置相应的padding和border值
2、你的h1添加一个text-align: center，你的文字自然就居中了

Answer 6

用div包住h1，然后div设置一个宽度或者padding，然后设置border-bottom