如何使双行边框在CSS中,每行的颜色不同,不使用背景图片?

前端之家收集整理的这篇文章主要介绍了如何使双行边框在CSS中,每行的颜色不同,不使用背景图片?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何在CSS中创建双线边框,每行使用不同的颜色而不使用背景图像?

例如像这样:

码:

<h2> heading 2 </h2>
<p> paragraph text </p>

<h2> heading 2 </h2>
<p> paragraph text </p>

注意:我不考虑IE 8,7,6

解决方法

我刚刚找到了谷歌搜索的方式,它对我有好处。
h2 {
    border-bottom: 1px solid blue;
    Box-shadow: 0 1px 0 red;}

资料来源:http://www.cvwdesign.com/txp/article/425/useful-tip-for-creating-double-borders-with-css3

编辑:我发现使用CSS 2.1伪元素实现多边框的另一种方式

支持:Firefox 3.5,Safari 4,Chrome 4,Opera 10,IE8

http://nicolasgallagher.com/multiple-backgrounds-and-borders-with-css2/

原文链接:https://www.f2er.com/css/220006.html

猜你在找的CSS相关文章