zoukankan      html  css  js  c++  java
  • 浏览器兼容、雪碧图及less技术

    浏览器兼容性
    1,<!DOCTYPE>技术
    2,reset技术:normlizi技术
    3,加前缀: -webkit- -o- -ms-
    4,css hack技术
    5,条件注释
    6,导入包(导入插件)

    解决浏览器兼容的方法:
    1、opacity——falter(0~100)/
    2、png背景——导包(插件)
    3、圆角——导包图片
    4、BFC——zoom1(无限制 在ie下触发bfc环境)
    5、双倍margin兼容性问题
    6、IE下3px差距(像素差距)
    7、font-size设置为10px以下,然后查看审核元素(正常显示16px,火狐最小10px,一般的浏览器显示12px)

      

    js中-用navigator 去判断浏览器版本

    【haslyout】
    不同的浏览器显示不同的内容
    www.helv,org.com

    软件:IEtester
    使用方法新建IE个版本 一般选择IE6,IE7,IE8

    9
    hack技术

    雪碧图技术sprate(精灵图)应用的是:背景定位和背景图片
    雪碧图合并:compass(将页面上 来选取里面的某一张图)
    充分利用定位方式来写
    网站上用到的一些图片正合到一张单独的图片中,从而减少你的网站的http请求
    数量该图片使用css background和
    【图片雪碧图时,所有的图片宽高相同】
    默认显示第一张图片,后面会循环显示

    避开(关键字)less sass的名称
    less是一种扩展技术,基于css来的, 变量 ,混合(也叫mixin),函数 ,运算, 简化了css 的代码,降低维护成本,必须用到解析器,目前用的是考拉 后缀名是.less的文件 ,必须通过解析器然后供页面使用
    混合


    变量:值可变
    @nice-blue:#数字
    @变量名-变量值(名称随便取,只要自己看得懂就可以)

    1,新建文件夹;2建两个文件,分别是.html .less为后缀名的;3启动考拉;4,配置路径,+号打开文件夹;5,less里写文件,写一部分后考拉再刷新;6,生成用less命名的css 的文件 link只能引入css文件,les 也能引入css文件


    混合mixin
    针对.class id 元素选择器三种


    带参数的混合:.名称(参数)(属性名:参数) backgroundUrl(@url)
    给参数设默认值 border-radins:@length
    不带参数属性值 .名称(){声明}

  • 相关阅读:
    什么样的代码称得上是好代码?
    九年程序人生 总结分享
    Docker入门 第一课 --.Net Core 使用Docker全程记录
    阿里云 Windows Server 2012 r2 部署asp.net mvc网站 平坑之旅
    Visual studio 2015 Community 安装过程中遇到问题的终极解决
    Activiti6.0 spring5 工作流引擎 java SSM流程审批 项目框架
    java 进销存 库存管理 销售报表 商户管理 springmvc SSM crm 项目
    Leetcode名企之路
    24. 两两交换链表中的节点
    21. 合并两个有序链表
  • 原文地址:https://www.cnblogs.com/duanfuying/p/5879439.html
Copyright © 2011-2022 走看看