利用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; }

效果如下:

转载于:https://www.cnblogs.com/qiye2016/p/5807323.html

css写出三角形(兼容IE)相关推荐

  1. css3三角形兼容_利用css3特性写出三角形(兼容IE浏览器)

    利用CSS写出三角形的效果 效果如图: 代码如下: .triangle-up { width:0px; height:0px; border-left:10px solid transparent; ...

  2. CSS样式写出三角形

    CSS样式写出三角形的样式,在这里只举出两个例子,三角形朝上和三角形朝下,还有左上,左下,右上,右下.有需要或者感兴趣的可以自己调一下代码.调border的top.bottom.left.right的 ...

  3. [css] 写出你遇到过IE6/7/8/9的BUG及解决方法

    [css] 写出你遇到过IE6/7/8/9的BUG及解决方法 把以前兼容IE6.7学习的东西搬出来了,还以为不见了.兼容性问题 1.IE6margin双边距问题 2.IE67 li间隙问题 3.图片间 ...

  4. [css] 写出主流浏览器内核私有属性的css前缀

    [css] 写出主流浏览器内核私有属性的css前缀 完善一下: Chrome:Blink内核 -webkit-Safari:WebKit内核 -webkit-Firefox :Gecko内核 -moz ...

  5. [css] 写出你知道的CSS水平和垂直居中的方法

    [css] 写出你知道的CSS水平和垂直居中的方法 flex布局水平垂直居中:<!-- html --> <div class="outer"><di ...

  6. [css] 写出几个初始化CSS的样式,并解释说明为什么要这样写

    [css] 写出几个初始化CSS的样式,并解释说明为什么要这样写 padding:0; margin:0;为了解决各个浏览器显示不一样的问题 个人简介 我是歌谣,欢迎和大家一起交流前后端知识.放弃很容 ...

  7. [css] 写出div在不固定高度的情况下水平垂直居中的方法?

    [css] 写出div在不固定高度的情况下水平垂直居中的方法? 我知道的有两种方法<!DOCTYPE html> <html><head><meta char ...

  8. [css] 写出在不固定宽高的元素在固定高度的情况下水平垂直居中的方法

    [css] 写出在不固定宽高的元素在固定高度的情况下水平垂直居中的方法 flex布局:还有就是可以用定位也可以实现等等: flex:父div:{display:flex: justify-conten ...

  9. [css] 写出固定子容器在固定的父容器下水平垂直居中的布局

    [css] 写出固定子容器在固定的父容器下水平垂直居中的布 1.父容器 position: relative,子元素 position: absolute;left: 50%;top: 50%;tra ...

最新文章

  1. 向海龙回应“被百度开除”:离开是为了专心做投资
  2. 大型网站应用中MySQL的架构演变史
  3. 职业中专的计算机综合应用,职业中专计算机教学的思考
  4. Go gin获取GET请求参数
  5. java nio copy_使用NIO快速复制Java文件
  6. 国外PHP学习网站书籍资料汇总
  7. NodeJS 使用官方oracledb库连接数据库教程
  8. 模板点击通过sql获得值 举例说明
  9. 判断数组中是否包含某一项 indexof 重复的判断不准_「JavaScript」: 老生常谈,数组类型...
  10. PSP XREADER 1.63下载(PSP阅读器)v1.6最新版 含安装/使用方法
  11. Axure教程-苹果X母版制作
  12. 测试用例设计方法之选择原则
  13. 在衣食住行上训练专注力
  14. 这样配置win10亲测不错
  15. 京东商城选择地址信息
  16. 校技能节之打铁记~~~~~~
  17. Vue 钩子函数activated未触发
  18. vulnhub靶场GoldenEye靶场
  19. 如何取消加密的pdf文件密码?
  20. 无线定位技术性能对照

热门文章

  1. VTK:Utilities之PCADemo
  2. OpenCV cv :: Mat的串行输出功能的实例(附完整代码)
  3. Qt Creator缩进文字或代码
  4. Qt Creator使用版本控制系统
  5. OpenGL envmapsphere球形环境图的实例
  6. 经典C语言程序100例之三一
  7. C++对象确定性解析单例模式
  8. display函数怎么使用_损失函数—深度学习常见损失函数总结【图像分类|上】
  9. Windows10避开注册的方式安装sourceTree,Failed to connect to github.com port 443: Timed out问题解决
  10. MyCat好的博文收集