首页 >web前端 >css教程 > 正文

兼容ie的css写法有哪些

原创2021-06-01 16:45:3601079

兼容ie的css写法有:1、在属性前面加上“-”或“_”,写法为“_属性:属性值”;2、CSS条件注释,语法“<!--[if IE 6]><link type="text/css" href="css地址" /><![endif]-->”。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

一、hack

写法:

.demo {
margin-left:30px; 
_margin-left:20px; 
}

优点:

1、内嵌在CSS中,编写的时候很方便

2、内嵌在CSS中,不会产生更多的HTTP请求

缺点:

1、没有统一在一个模块中,后期维护和修改麻烦

2、即使这种写法不起作用的浏览器,也会将代码加载进去,浪费资源

二、CSS条件注释

写法:

<!--[if IE 6 ]>
    <link rel="stylesheet" type="text/css" media="all" href="./ie6.css" />
<![endif]-->

优点:

1、代码独立出来,有利于后期维护

2、对于代码不起作用的浏览器来说,这段代码只是普通的注释,他们加载的时候不会将其内容加载进去,节省资源

缺点:

1、新增了HTTP请求,对于老版本的IE浏览器来说,无疑增加了压力。

扩展:

HTML标签条件注释

<!DOCTYPE html>   
<!--[if IE 6 ]> <html class="ie6 lte_ie6 lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if lte IE 6 ]> <html class="lte_ie6 lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if lte IE 7 ]> <html class="lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if lte IE 8 ]> <html class="lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="zh-CN"><!--<![endif]-->
.ie6 .demo {  
    margin-left: 20px;
      }

这种方法可以将代码独立出一个模块,也不会新增加HTTP请求,目前被使用较多。

推荐学习:css视频教程

以上就是兼容ie的css写法有哪些的详细内容,更多请关注php中文网其它相关文章!

php中文网最新课程二维码

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

  • 相关标签:css ie兼容写法
  • 相关文章

    相关视频


    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
  • 专题推荐

    作者信息

    醉折花枝作酒筹

    飞花飘絮,霓裳翩翩舞,几多情愫心飞扬。

    最近文章
    css如何设置指定网格的大小和位置492
    css如何定义网格线大小1173
    教你一招搞定css背景图的大小854
    推荐视频教程
  • CSS的美化功能CSS的美化功能
  • HTML/CSS技术小知识每日分享HTML/CSS技术小知识每日分享
  • CSS 代码实例CSS 代码实例
  • 让布局像5G一样快:CSS Grid网格布局让布局像5G一样快:CSS Grid网格布局
  • Web开发基础_HTML+CSSWeb开发基础_HTML+CSS
  • 视频教程分类