css 标题底部边框线宽度

html-css018

css 标题底部边框线宽度,第1张

很简单，利用span本身文字宽度自适应属性，和下边框厚度即可解决，再用padding设置下边框和文字之间的间距。代码已经过成功测试：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<meta http-equiv="Content-Type" content="text/html charset=GB2312" />

<title>无标题文档</title>

<style type="text/css">

<!--

.border {

color: red

font-size: 16px

font-weight: bold

line-height: 28px

border-bottom: 3px solid red

padding-bottom: 3px

}

-->

</style>

</head>

<body>

<span class="border">2014持续高温.2014持续高温.2014持续高温.</span><br />

<span class="border">2014持续高温.持续高温.</span><br />

<span class="border">2014持续高温.2014持续高温.</span><br />

</body>

</html>

News5 li{no-repeat top leftpadding-left:15pxpadding-bottom:-10pxmargin-bottom:0px}

调整no-repeat top left这个，应该写成no-repeat left top把其中的top改为数值 调整数值大小到背景为居中位置就可以了 如3px 5px等等