css 三角形的制作

Posted gao7

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css 三角形的制作相关的知识,希望对你有一定的参考价值。

样式表:
<style>
.triangle_border_up{
width:0;
height:0;
border-width:0 60px 60px;
border-style:solid;
border-color:transparent transparent red;/*透明 透明 灰*/
}
</style>
 
html
<body>
<div class="triangle_border_up">
<span></span>
</div>

<div class="heartRight">
<span></span>
</div>
</body>
 
效果:技术图片

 

以上是关于css 三角形的制作的主要内容,如果未能解决你的问题,请参考以下文章

如何制作边缘平滑的 CSS 三角形?

CSS三角形制作样式

css 三角形的制作

使用CSS3制作三角形小图标

如何在不使用边框和图像的情况下在 div 上制作 CSS 三角形背景? [复制]

CSS3制作互动三角形