zoukankan      html  css  js  c++  java
  • 如何根据不同的浏览器写不同的css样式达到兼容

     做前端静态页面的时候总是发现,ie的兼容性很差,总会出点问题。然后就去改代码 ,改完以后 又发现 火狐 谷歌又挂了,这可咋整。
        后来发现做个判断吧 哪里有问题哪里就做个判断呗 ,咋判断呢,这么判断。
     
     <!--[if lte IE 6]>
    <![endif]-->
    IE6及其以下版本可见,就是ie5,ie4.。。的话 就调用这个css。

    <!--[if lte IE 7]>
    <![endif]-->
    同道理了。。同上

    <!--[if IE 6]>
    <![endif]-->
    同道理了。。同上

    <![if !IE]>
    <![endif]>
    同道理了。。同上

    <!--[if lt IE 8]>
    <![endif]-->
    IE8以下的版本可见


    <!--[if gte IE 7]>
    <![endif]-->
    同道理了。。同上

    这么判断就行,你可以没事试试
     <!––[if IE]>
           <h1>您正在使用IE浏览器</h1>
           <!––[if IE 5]>
               <h2>版本 5</h2>
           <![endif]––>
           <!––[if IE 5.0]>
               <h2>版本 5.0</h2>
           <![endif]––>
           <!––[if IE 5.5]>
               <h2>版本 5.5</h2>
           <![endif]––>
           <!––[if IE 6]>
               <h2>版本 6</h2>
           <![endif]––>
           <!––[if IE 7]>
               <h2>版本 7</h2>
           <![endif]––>
    <![endif]––>
    那如果当前的浏览器是IE,但版本比IE5还低,该怎么办呢,可以使用<!–[if ls IE 5]>,当然,根据条件注释只能在IE5+的环境之下,所以<!–[if ls IE 5]>根本不会被执行。
    lte:就是Less than or equal to的简写,也就是小于或等于的意思。
    lt :就是Less than的简写,也就是小于的意思。
    gte:就是Greater than or equal to的简写,也就是大于或等于的意思。
    gt :就是Greater than的简写,也就是大于的意思。
    ! : 就是不等于的意思,跟javascript里的不等于判断符相同


    (2)
    来,看个我写过的东东。
    <!–- 默认先调用css.css样式表 –->

    <link rel="stylesheet" type="text/css" href="css.css" />
    <!-–[if IE 7]>

    <!–- 如果IE浏览器版是7,调用ie7.css样式表- –>

    <link rel="stylesheet" type="text/css" href="ie7.css" />
    <![endif]–->

    <!–-[if lte IE 6]>

    <!–- 如果IE浏览器版本小于等于6,调用ie.css样式表 -–>

    <link rel="stylesheet" type="text/css" href="ie.css" />
    <![endif]–>

      其他浏览器的话 都好调了 自己调呗。。试试看
        

     

  • 相关阅读:
    K8s 使用 nfs-client-provisioner
    MySQL IF CASE 例子
    Nginx 限速
    Python 元组操作
    Python if, while,for,continue,break,三目运算符
    Centos7 安装 pyenv
    MySQL 查看大事务
    Tomcat 修改日志路径及日志分割
    游戏攻略 美少女万华镜5
    自建远程桌面过程 vnc + frp
  • 原文地址:https://www.cnblogs.com/HoverM/p/4812181.html
Copyright © 2011-2022 走看看