css画三角形
2016-03-14 18:12
465 查看
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .triangle { width: 0; height: 0; border-top:100px solid red; border-right: 100px solid blue; border-bottom: 100px solid black; border-left: 100px solid yellow; } </style> </head> <body> <div class="triangle"></div> </body> </html>
利用border的 top,right,bottom,left 四个方向,设置颜色和宽度
把任何一边 设为透明,或者设为白色,都可以成为一个三角形
相关文章推荐
- css 画矩形
- css样式
- CSS模块化基本思想
- 自定义RatingBar显示的样式
- css3 box-sizing属性
- CSS2【3】-- Positioning
- 一步步教大家编写酷炫的导航栏js+css实现
- [DIV/CSS] 用CSS和JS打造一个简单的图片编辑器
- 谈谈css王朝的px,em,rem之间的那些事儿
- iOS - 同一个Label的不同样式显示
- [DIV/CSS] 【译】下一代选择器:CSS4
- 自定义 <input type="file" /> 样式
- CSS3:布局
- 2016.3.14__CSS 浮动__第五天
- 手链样式( 使用全排列函数next_permutation)
- Sass mixin 使用css border属性画三角形
- dispaly:table布局
- 2016.3.14__CSS 盒模型_第四天
- css3中-moz、-ms、-webkit分别代表的意思
- css height:100%失效