多语言展示
当前在线:1810今日阅读:27今日分享:41

CSS画三角形教程

网页因为 CSS 而呈现千变万化的风格。这一看似简单的样式语言在使用中非常灵活,只要你发挥创意就能实现很多比人想象不到的效果。特别是随着 CSS3 的广泛使用,更多新奇的 CSS 作品涌现出来。
工具/原料
1

网页浏览器

2

sublime编辑器

方法/步骤
1

打开sublime编辑器,新建一个html文件

2

建好了之后在之间把样式写出来,这里先写一个向上的三角形样式代码如下:.san { width: 0; height: 0; border-left: 50px solid transparent;   border-right: 50px solid transparent; border-bottom: 100px solid #ff0066;}

3

在里面写好样式后,我们在来写个div标签,代码如下

4

写好之后,我们在浏览器中查看,效果如下所示。

5

继续画左右下的三角形代码如下:Document

6

最后在浏览器里预览的效果如下:

注意事项
1

注意一点,width与height最好都设为0

2

共同分享,共同成长。

推荐信息