使用背景图像制作菱形
使用背景图像制作菱形
提问于 2013-03-21 20:04:31
我使用下面的测试代码来尝试创建一个菱形形状。跨度是一个标准的长方形，两边看起来像菱形。
**********
* *
******但是，之前和之后的选择器似乎不会呈现任何内容。我不确定我是不是做错了，或者我只是更好地绝对地定位它们。
有什么想法吗？
<style>
span {
width:50px;
height:20px;
color:white;
background-color:red;
padding:10px;
}
span:before {
background: url('left_side.png') left center no-repeat;
height:43px; width:22px;
}
span:after {
background: url('right_side.png') right center no-repeat;
height:43px; width:22px;
}
</style>
<html>
<body>
<span>
Some text goes here
</span>
</body>
</html>Stack Overflow用户
发布于 2013-03-21 20:20:44
#demo { border-top: 100px solid red;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
height: 0; width: 100px; }在没有图片的情况下，人们为什么要制作css3
演示：http://jsfiddle.net/sahilpopli/dRyLg/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15547027
复制相关文章
相似问题
腾讯云开发者
