只使用CSS就可以实现这个功能区吗？
最佳答案
HTML：
Box">
CSS：
.Box {
width: 300px;
height: 300px;
background-color: #a0a0a0;
position: relative;
}
.ribbon {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
border: 25px solid transparent;
border-top: 25px solid #757575;
position: absolute;
bottom: 20px;
right: -50px;
padding: 0 10px;
width: 120px;
color: white;
font-family: sans-serif;
size: 11px;
}
.ribbon .txt {
position: absolute;
top: -20px;
left: 20px;
}
例：
http://codepen.io/gilluminate/pen/jusoI
(PS.除旋转之外的所有内容仍然适用于旧浏览器.)
原文链接：https://www.f2er.com/css/427236.html
