HTML – 双色边框

前端之家收集整理的这篇文章主要介绍了HTML – 双色边框前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我知道可以使用一个低于另一个的双边框的效果但是可以使用css将边框宽度的一部分设为一种颜色而其余部分是另一种颜色?

以下是我想要仅使用css重新创建为边框的图像示例:

解决方法

我想我找到了一种方法.查看 http://jsfiddle.net/RE4A7/

HTML

<ul>
<li><h3>Mission</h3>
</li>
</ul>

CSS

ul h3 {
font-size:1.2em;
font-family:arial;
border-bottom:1px solid #333;
padding-bottom:10px;
position:relative;
width:250px;
}
ul li {
list-style:none;
}
ul h3:after {
border-bottom:1px solid #ff4800;
bottom:-1px;
left:0px;
content:"";
position:absolute;
width:55px;
}

猜你在找的HTML相关文章