[英]How to have a curved edge triangle
I wanted a curved edge triangle in css3.Is it possible to get it in css3 ? 我想在css3中使用一个弯曲的边缘三角形,是否可以在css3中获得它? My code below has a normal triangle...
我下面的代码有一个普通的三角形...
http://jsfiddle.net/dVbJr/ http://jsfiddle.net/dVbJr/
#left-triangle {
width: 0;
height: 0;
border-right: 100px solid orange;
border-top: 50px solid transparent;
border-bottom: 50px solid transparent;
}
I wanted like this.. 我想要这样
You can do like this: 您可以这样:
CSS CSS
.arrow{
width:50px;
height:100px;
position:relative;
overflow:hidden;
}
.arrow:after{
content:'';
width:100px;
height:100px;
-moz-transform:rotate(45deg);
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
background:red;
position:absolute;
top:0;
right:-70px;
border-radius:10px;
-moz-border-radius:10px;
}
HTML HTML
<div class="arrow"></div>
Check this http://jsfiddle.net/dVbJr/4/ 检查此http://jsfiddle.net/dVbJr/4/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.