时间:2021-07-01 10:21:17 帮助过:69人阅读
利用css写三角形,兼容IE7
- .arrow-up {
- width:0px;
- height:0px;
- border-left:10px solid transparent;
- border-right:10px solid transparent;
- border-bottom:10px solid red;
- font-size:0px;
- line-height:0px;
- margin: 0 auto;
- }
- .arrow-down {
- width:0px;
- height:0px;
- border-left:10px solid transparent;
- border-right:10px solid transparent;
- border-top:10px solid blue;
- font-size:0px;
- line-height:0px;
- }
- .arrow-left {
- width:0px;
- height:0px;
- border-bottom:10px solid transparent;
- border-top:10px solid transparent;
- border-right:10px solid #DC143C;
- font-size:0px;
- line-height:0px;
- }
- .arrow-right {
- width:0px;
- height:0px;
- border-bottom:10px solid transparent;
- border-top:10px solid transparent;
- border-left:10px solid #FF00FF;
- font-size:0px;
- line-height:0px;
- }
效果如下:
以上就是本文的全部内容了,希望大家能够喜欢。
【相关教程推荐】
1. CSS视频教程
2. CSS在线手册
3. bootstrap教程