<div class="entry">
<div class="entry-triangle"></div>
单色很难过
单色很难过
单色很难过
</div>
<style>
*{
margin: 0;
padding: 0;
}
body{
background: yellowgreen;
}
.entry{
width: 100px;
margin: 100px auto;
padding: 10px;
background-color: aqua;
border-radius:10px;
/* -webkit-border-radius:10px; */
/* -moz-border-radius:10px; */
}
.entry-triangle{
position: absolute;
margin-left: -20px;
width: 0;
height: 0;
border-right:10px solid aqua;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
}
</style>
简易版的三角形
<style>
div{
width: 0;
height: 0;
border-right:20px solid aqua;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
}
</style>