• 如何根据不同的浏览器写不同的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]–>

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

     

  • 相关阅读:
    Cassandra开发入门文档第三部分(非规范化关系结构、批处理)
    Cassandra开发入门文档第二部分(timeuuid类型、复合主键、静态字段详解)
    Cassandra开发入门文档第一部分
    Flume的Source、Sink总结,及常用使用场景
    Libgdx学习笔记:分享自己写的异步加载
    jquery easyui toolbar 分割线问题
    easyui datagrid设置fit: true后,页面显示不全的情况
    CentOS下安装JDK1.7
    CentOS 7搭建SVN服务器
    SWT中ole/activex实践--操作word的一个例子
  • 原文地址:https://www.cnblogs.com/HoverM/p/4812181.html
Copyright © 2020-2023  润新知