.box {
width: 0;
height: 0;
border: 10px solid transparent;/*透明*/
border-top-color: pink;
line-height: 0;/*后两行是为了照顾兼容性*/
font-size: 0;
}
首先设置宽高为0,再指定透明的边框,最后将需要的边框改变颜色即可
例子:
<style>
.box {
position: relative;
width: 120px;
height: 250px;
background-color: pink;
}
.box span {
position: absolute;
right: 15px;
top: -10px;
width: 0;
height: 0;
line-height: 0;
font-size: 0;
border: 5px solid transparent;
border-bottom-color: red;
}
</style>
<body>
<div class="box"></div>
<span></span>
</body>