CSS 标题边框问题答案

【问题标题】：CSS Header Border IssueCSS 标题边框问题
【发布时间】：2014-01-08 01:54:50
【问题描述】：

让我的标题标签边框正确有些问题。

我的目标是底部边框为 1 像素，顶部边框为 2 像素，宽度为 65 像素

这是我的代码，以及指向小提琴的链接

h1, h2, h3{
    border-bottom:1px solid #ddd;
}
h1:before, h2:before, h3:before{
   content: " ";
   position: absolute;
   bottom:0;
   z-index: -1;
   width:65px;
   border-bottom: 2px solid #666;
}

http://jsfiddle.net/o7thwd/rqN4z/

【问题讨论】：

标签： html css

【解决方案1】：

您可能需要将h 标记设为绝对:before 元素的相对父级。试试这个：

h1, h2, h3 {
   position:relative;
}

演示http://jsfiddle.net/BWT66/

【讨论】：

谢谢。我在能够删除问题之前发现了这一点:)

【解决方案2】：

http://jsfiddle.net/rqN4z/7/

你必须删除这条线

h1:before, h2:before, h3:before{
   bottom:0; //remove this
}

【讨论】：