用CSS将div变成三角形
2017-01-05 20:51
169 查看
方形变三角形
通常我们印象中的HTML元素都是四四方方的,但是四四方方的东西也可以构建出完美的三角形哦。因为当一个矩形必须要平分给其上下左右四个方向的时候,就只好平分成四个三角形了。代码实现
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <style> div { width:0; height:0; border:100px solid; /* 平分效果 */ /*border-color:red green blue black; */ /* 单个三角形 */ border-color:transparent transparent lightgreen transparent; } </style> </head> <body> <div></div> </body> </html>
相关文章推荐
- CSS实现DIV三角形
- html中css使用div绘制三角形
- 纯CSS 三角形箭头Div边框代码
- CSS实现DIV三角形
- 使用Css和Div ”画“个三角形
- CSS实现DIV三角形
- css如何将div画成三角形
- div css 伪类 不固定图片大小 居中, css div 实现三角形
- DIV+CSS实现左侧带三角形的提示框
- css+div 定义三角形
- div+CSS实现三角形
- 用CSS对DIV画三角形
- Css三角形 div全屏 半透明
- Div + CSS一些特效使div变成圆角、提交按钮的特效等等
- div+css遮罩层
- css案例学习之div+a实现菜单
- HTML CSS + DIV实现局部布局
- DIV+CSS中标签dl dt dd常用的用法
- 整理DIV+CSS网页布局实用技巧错误解决
- 精通 CSS+DIV 网页样式与布局 24