大前端笔记08

HTML第一阶段day08

ie8兼容问题

1、ie8下a标签中的图片显示边框
解决：

    img{
        border:none;
    }

2、背景属性的复合写法
backgound: url("./pic.jpg") no-repeat left red ;
属性值之间必须加空格，否则ie8无法显示

透明方法

1、rgba(0-255,0-255,0-255,0-1) 模式颜色 ie9以下不支持，css3提供的颜色模式
2、opacity: 0-1; 盒子整体透明 ie9以下也不支持
3、filter: alpha(opacity=50); ie的透明滤镜

小箭头

• 思路：先实现两个小三角，通过定位使两个三角不完全覆盖，上面的三角颜色设置为背景色

css精灵图、雪碧图（css贴图定位）

• 把多个小图片整合到一张图片上，通过背景图片引入，调整背景定位，显示出不同的图片
• 优点：
  • 减少http请求，提高性能
  • 减少命名困扰
  • 方便风格更换
• 缺点：
  • 盒子大小要和图标保持一致，位置要精准计算