让我们在文字的下面增加一条1点宽的灰色边框,以增强清晰度(看图2-3):
h1 {
font-family: Arial, sans-serif;
font-size: 24px;
color: #369;
padding-bottom: 4px;
border-bottom: 1px solid #999;
}
font-family: Arial, sans-serif;
font-size: 24px;
color: #369;
padding-bottom: 4px;
border-bottom: 1px solid #999;
}
我们在文字的下方增加了一点补白,来让线条附近宽松一点。由于标题是一个块级元素,所以它的边界不仅仅到文字,而是与页面的水平宽度灵活的保持一致。
值得指出的是,这个特别的创建边框的方法是一个由三部分组成的语句:宽度、式样、颜色。试着改变它们的值,看看会产生什么不同的效果。