我试图在每个实例下方自动放置一条 100% 水平线(规则)
<h1>
使用 CSS 的标头标签。
我想看到的示例:
--- 剪断 8
介绍
--- 剪断 8
我的CSS中有这个:
.mypage .headline {
font-family: Calibri, "Helvetica", san-serif;
line-height: 1.5em;
color: black;
font-size: 20px;
}
我的 HTML 主页面中有这样的内容:
<body class="mypage">
<h1><span class="headline">Introduction</span></h1>
我无法弄清楚如何在标题类的每次使用下方出现一条水平线。
您也可以尝试使用伪类:after. http://www.w3.org/TR/CSS2/selector.html#before-and-after。我在我的一个应用程序中使用了这种样式。
http://jsfiddle.net/ffmFQ/ http://jsfiddle.net/ffmFQ/
h1:after
{
content:' ';
display:block;
border:2px solid black;
}
您可以稍微整理一下以设计如下所示的样式:-http://jsfiddle.net/5HQ7p/ http://jsfiddle.net/5HQ7p/
h1:after {
content:' ';
display:block;
border:2px solid #d0d0d0;
border-radius:4px;
-webkit-border-radius:4px;
-moz-border-radius:4px;
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)