90.尚硅谷_HTML&CSS基础_条件hack.avi原创

那说今天咱们这个内容啊，昨天呢，咱们最后呢，说了一个这个IE6PNG的问题，我们说了IE6对我们这个pgs的格式，它支支持度不好，怎么不好呢？它这种透明的效果是无法显示啊，我们说了在IE6里边这种透明的图片它会显示成什么呀，显示有点发灰发蓝，那么一个那么一个效果，对吧？哎，那所以我如果为了兼容A6，我只有两种解决方式，我可以干嘛呢？可以用这个PNG8来替换这个PND24，但是我们说了PNNG8的这个效果它比较什么呀？诶比较差，稍微的差一点啊，稍微差一点，所以我们如果说追求这种极致的清晰的话，其实用PG8呢，并不是一个特别的好的选择，所以我们还得需要用什么呀，用PNG24，那所以解决这个问题的时候呢，我们采用什么呀，我们在页面里引入了一段这个GS代码，通过这个GS是不是来解决的我们这个兼容性问题啊哎，来解决兼容问题，那这个东西其实你要是干嘛呀，你给它写成一行的，其实也也可以啊，可能还更小一点啊，那现在我们来说。

我这一段代码的作用是干嘛的，是不是就是为了去解决我们那个IE6的一个兼容性问题啊，诶IE6的一个兼容性问题，那我们来说一下这一段代码，也就是说我只希望在哪执行，是不是只希望在IE6里边执行啊，在其他的浏览器里，我实际上是不希望他去干嘛呀，诶他去执行的，但是现在我们来说，现在我们说了，除了IE6，其他浏览器会不会执行这个东西对于所有浏览器来说，实际上是不是都是一样的呀，在IE6里边会执行，在其他浏览器里同样也会执行，只不过在其他浏览器里执行的时候，它干嘛了，哎，它就是什么呀，就没用啊，它没用，没有什么作用，也不会给你报什么错啊，也不会给报什么错，包括在我们这个火狐里，同样一打开它，它显示效果是一样的，而且这里边什么呀，他也不会给你报出任何的错误啊，虽然没有错误，但是注意它也干嘛了呀，它也执行了。而且我们来说我这。

是不是有一个GS文件呀，这个GS文件它也是这个效果，是不是在每个浏览器里头都加载了呀，而这个东西对于家浏览器来说有没有用啊，没有用，是不是只对这个ID6有用啊？哎，那我们想了，那既然这个东西我只对IE6有用，那我是不是就希望只在IE6里执行，而在其他浏览器它不执行啊？哎，那这个事儿我们要怎么办？来说一下。新建一个外部项目，来一个DAY09，我们说一个新的一个知识，叫做一个叫做一个什么呢？CSS一个哎，Hick啊CS hick hick这个东西是干嘛的呢？那我们来说有一些情况什么呢？有一些情况什么呢？有呃一些这种特殊的这种什么呀，代码我们什么呢？我们只需要在什么呀，在某些诶某些特殊的浏览器中干嘛呀，诶中执行，而什么呢？而在其他的这个浏览器中干嘛呢？诶不需要执行，那这时就可以干嘛呢？诶这时诶就可以使用什么呢？我们这个CSS这个诶hick来干嘛呢？诶来解决该问题，诶解决该问题那什么叫。

DS hick呢？那我们说CSS hick，那实际上干嘛呢？诶实际上诶指的是什么呢？诶是一个特殊的什么呀，特殊的这个呀，代码我们说什么呢？这一段代码只在什么呢？只在我们这个某些什么呀，某些浏览器中可以什么呀，可以识别，而其他浏览器呢？而其他浏览器干嘛呀？哎不能识别，诶通过这种方式干嘛呢？诶来为一些浏览器干嘛呢？诶设置特殊的这个代码啊来设特殊代码，那我们说了这个某些浏览器，某些特殊浏览器主要指谁啊？哎主要指我们这个IE啊，主要指的是我们这个IE，比如说我们这个特殊代码是谁，就拿我们刚才说的这个图片，这个兼容性问题，我们是不是有一段这段代码啊，这段代码我们只需要在我们这个IE6里执行，而在其他浏览器里我是不是不需要执行啊？

那这块怎么办呢？你怎么办呢？诶那这里边举个例子啊，举个例子，咱们先不拿它演示，我拿一个P标签演示，P标签演示我是一个这个P标签保存，这是一个P标签，假设这个P标签，我只希望什么呢？我只希望在IE6里出现，诶或者说这样写吧，我这么写吧，我里边写一段提示文字啊提示文字叫什么呀？哎叫什么呀，叫做诶请叫什么呀，为了您和这个家人的这个健康，哎，请远离I16，诶我是不是写这么一段非常友善的一个提示语啊，哎提示语，但是这块我写完了以后，它有个问题，什么问题啊，CTRLL运行在火狐狸是不是已经看见了呀，你在火狐里这句话我是专门给那些IE6的用户提示了吧，你在火狐里看见火狐的用户，是不是感觉这东西它不是很友好啊，哎，不是很友好，包括什么呀，你在我们什么呀，在我们的这个chome里是不是也能看见。

啊，哎，那再来看我们这个IE6。I16，这是我们来打开我们家IE61看，是不是也可以看见啊，哎，也可以看见，虽然爱一六可以看见，我们是希望的，但是我希望什么呀？是不是只有他能看见啊，哎，只有它能看见，那我们来说怎么让怎么能做到只让A6看到，而其他浏览器看不到呢？那这一块就要用到什么呢？我们这个条件的一个海口。来说一下啊，我直接写了这里边呢，我们这个工具很方便你直接印outt鞋带，第一个就是啊，第一个就是写了一个什么呢？叫做一个if IE啊if IE这是一个什么呢？这个东西起个名叫什么呢？叫做一个条件hi，哎，条件hi，那这个hi可以干嘛呢？可以根据指定的条件来判断是否执行，这里边什么呀，代码啊，这这边代码，那我们来看啊，我们来说，首先我们来说一个问题，条件hick只对我们什么呀？IE浏览器干嘛呀，有效啊，只对IE浏览器有效，其他的浏览器都会什么呢？都会将它识别，为什么呢？识别为注释啊，你来看我们这孩子长啥模样啊，你来看我前边，你不用看后边，你就看前边这是一个什么，这是不是一个注释的开头啊，你来看这这是一个什么，是不是注释的一个结尾啊，那实际上这整个中间这段内容都是什么呀，都是一个注释啊，都是一个注释，而干嘛呢，现在你来。

看了，我把这个P标签来放到这里边儿，那意味着什么呀？这个P标签是不是也是一个注释啊，注意所有的浏览器都会把它当成一个注释，除了IE啊，除IE，所以那既然是个注释了，我们来看看在火狐里一刷新。

是不是没了，诶在里我这一刷新走你是不是也没了，诶但是在我们这个IE6里，我一刷新是不是还在呀？诶还在，然后看一眼谁呢？看一下我们IE11，诶你发现什么了，IE11是不是也没有啊来F12，我们来看看什么呢？IE10IE10不是也没有啊，诶所以这里边注意IE对浏览器有效，而是什么呢？IE10及诶以上的这个浏览器已经什么了，诶不支持这种方式，哎，这种方式只是什么爱意十以下的，我们来看看谁呢？看看IE9走你是不是还有啊哎，来看看我们这个爱叶八是不是也有啊，诶都有啊，所以这个东西只有IE识别，而其他浏览器不识别，那我们来看看它是一个什么意思啊，什么意思？首先前边是一个注释，后边就有一个什么呀，就是一个固定格式，这都是一个什么呀，固定的一个格式，那我们来看什么意思，诶，首先这有一个if if什么意思，如。

如果如果什么呀，如果IE说白了就是什么呀，如果你是I，我是不是才会执行这个代码啊，诶我才会让他在页面中显示，然后最后有一个叫什么呀，N的if服表示我这个判断干嘛了，结束了啊结束了，所以这就表示什么呀，对我们这个进行一个判断，如果你是IE我才显示，如果不是，我是不是就不显示啊哎，那问题就来了，那现在我不想判断它是不是IE，我想判断什么呀，我想判断它是不是IE6，因为我们这句话叫远离IE6，并不是远离IE对吧？我想判断它是不是IE6，如果是IE6我就显示，如果不是，我是不是就不显示啊，那怎么写呢？诶IE后边加一什么呀，空格来什么呀，六啊叫什么呀，If ie6啊if I6保存我们来看效果，现在火狐cru肯定是没有的啊，Chome火狐肯定没有的，然后看我们IE这是几IE8走你。

是不是也没了，诶来看我们这个艾叶九是不是也没了，哎，为什么？因为我们这是不是加了一个判断呀，If艾叶六啊，If艾E6，然后看艾E6，我这一刷新走，你I6是不是有了呀？诶IE6有了啊这就是我们说一个条件hi啊条件hi，这里边我们说以下代码，以下这个内容只会诶出现在我们这个艾叶六中，因为我们加这么一个判断，诶那现在我们说了，那假如说我想干嘛呢？我想判断是不是I18，你怎么办呀，我是不是把六换成八呀，哎，我把六换成八，所以我这换一句话叫什么呀？诶当前浏览器是我们这个艾叶八，我这一保存，咱们看E6啊一刷新有没有。这是，哎，这是第一个我们要看的是哪句话呀，第二句话吧，哎，爱八这句话有没有啊，哎，没有啊，然后火狐苦我们就不用看了啊，直接看A9艾九是也没有啊，哎，然后看我们阿一八走，你是不就出来了，哎就出来了啊，所以注意后边可以跟的是他这什么呀，版本啊，跟的是版本，六就表示I6，八就表示I8，九就表示I9，七就表示I7啊以此类推，这是我们这个6A8，哎还有什么东西乱七八糟的啊好，这个呢，是我们说的这个IE6IE8，那有的时候我们还这个需求，其实就挺就已经足够用了是吧，但是有的时候我们还希望什么呀？哎，比如说我有这么一个P标签，我要干嘛呢？来该标签会在我们这个艾叶。

IE8以下的这个浏览器中显示啊，在IE8或者这样写吧，在IE9以下的浏览器中显示，那也就是说IE9以下的包括谁是包括IE8IE7IE6啊都包括，那现在我如果这么写，咱们来看啊，我把这复制过来，CTRLX粘过来T，我说来一个IE9这么写行不行，这么写什么意思呀，是不是完全跟我这相反的呀，这个是不是只在IE9里显示啊，而我们这个要求什么呀，在IE9以下的我们先看效果啊，我一刷新这是IE81刷新没有吧？诶来看IE9。

走你I9是不是才有啊？哎，I9才有，而IE8里是没有的，而我们要求什么呀？是在IE9以下的IE8 ie7ie6应都应该都有，应该都有RII9什么应该没有啊，诶，那这块怎么办呢？在if后边我还可以再加一个，来什么呢？来一个空格叫一什么呢？叫做一个LTLT叫什么意思呀？哎，来S叫什么呀？小于啊，小于就是什么呀，如果你小于I9，我是来显示啊，哎，如果你小于I9我才显示啊，现在我来看I9还有没有了，走你I9是不是没了呀？因为I9它就是I，它就是九，它不小于吧，哎，它是等于九的啊来再看八是不是就有了呀？哎，再看什么呢？再看我们这个七是不是也有了呀？哎，那再看我们这个六是不是也有了呀？哎，所以注意LT表示什么呀，表示这个小于啊，LT表示小于，那还有什么呀，哎，还有GT表示什么呀，大于啊，GT表示什么呀，大于。

A9的还有什么呢？那我们就如说LT，我需要什么呀，我希望哎，包括I9，也就是说I9你也得显示，那怎么办呀，我是不是要小于等于啊，怎么写呢？LTE啊，LTE叫做lesson and equals，就是小于等于保存，我们这在刷新，现在看IE7是不是依然有啊，再看我们这个IE9是不是也有啊，哎，LTE叫做一个小于等于啊，那这个呢，就是我们基本的一个这么一个用法，这叫做一个注释的一个条件的注释，这么一个hicker，它非常的简单，非常的好用，然后具体的语法我们来看一眼啊，这里边给你们提供这么一个文档，待会发给你们啊，有一个CSS这么一个文档，这个文档呢，我们来看，在这专门有一栏去讲，叫做一个CSS hick来点开它，我们有一个条件，HI1展开，我们来看它这个语法就给你写上了，首先外边是不是跟刚才我们的格式是一样啊，外边是一个注释，然后里边是一个什么呀，If。

这一个叫做一个keywords，关键字后边紧跟着是一个YIE，然后是一个什么呀，Were，哎，Worse，哎，这都加了一个问号，加了一个问号表示什么呀。可选的，哎，说白了就是写不写都行啊，Keyword还有沃son，写不写都行，沃son表示什么意思啊，版本啊版本你可以写什么呀，六啊七呀八呀九啊，是不是都行啊，哎，然后这关键字呢，刚才我写的什么呀，什么LT呀，什么GT呀，什么LT啊都是可以的，然后keywords下边给你写了一个描述，我们来看写什么，第一个叫什么呀，是否关键字是什么呀，空说白了什么呀，你什么也不写if，像我们这种什么也不写，我来什么呀，If服。

Aeee表示什么意思呀？哎，是否是IE6啊，是否是IE6，什么也不写，表什么呀，表示是否，然后下面一个什么呀？有个叫做GT叫什么呀？诶，Greater than啊，Great than叫什么呀？哎，大于啊，Greater than叫做一个大于，然后这一个GT great than or什么呀？Eagle叫什么呀？大于或等于啊，大于或等于，然后还有什么呀？LT叫一什么呀？Less than，小于啊，小于，还有一个LT叫做less than or equal口小于或等于啊，小于或等于这块对照着看一下就行了。还有一种特殊的叫什么呀？叹号叫什么呀？诶，这是叹号不是哎啊点零下面的叫什么呀？非诶什么叫非呀，说白了就什么呀，除了哎，除了哎，所以这里边你要写什么呢？我这写一这么写一个写什么呢？写一个这个叹号列表什么呀？哎，除来A6啊，除来一六，那我就可以写一个，哎，您的浏览器不是IE6来保存，我们来看IE6里我这一刷新走，你是不是没有啊，哎，没有，然后看其他的这一刷新走，你九是不是有啊，诶然后看我们这个八这一刷新不是也有啊，然后看我们这个七是不是也有啊哎，你的浏览器不是I6，但是注意了，在我们这个十里边，还有11里边，以及火狐还有group就都没有了，为什么？因为这个东西只支持I意十以下的浏浏器啊，76789都支持，但是十十一就不灵了啊，十十一就不灵了。

好，这是我们说的这个条件的这个height，那回到我们刚才我们上我们昨天讲的这个东西，我把这块啊给它复制一下图片啊，G SIM mg ctrl c都粘过来，粘过来以后呢，我们来看一下，那这个东西我们就可以改一下了，零二图片吧，那我们来看那这个东西我现在希望什么呀，我是不是希望只在IE6里有效啊，那我可以怎么办呀？诶我是不是给它加一个那个条件，Hi呀，那注意了啊，这块注释不能签到，我把这些注释给去掉，我这来直接来一个CTRL斜杠，它有提示这一什么呀，If IE啊if IE，我这来一什么呢？If IE空格来一个什么呀，六也就说我只在IE6里是不是使用啊，然后把这一堆CTRLX全都放在这里，那现在就意味着什么，诶，它只会在IE6里边执行，而在其他浏览器里干嘛呀，不执行啊，在其他浏览器里不执行好，那这里边我们来看看，这当然就看不出效果了是吧？哎，都是正常的，那我们就不再去测试了啊，不再去测试了，这东西只会在IE6里去执行。

啊，所以诶以下代码只会在我们这个艾叶哎六中执行，其他浏览器中干嘛呢？诶无效啊，或者说不会执行啊，这就是我们说的一个叫什么呀，叫做一个条件，Hi也是我们用的比较多的一种方式啊，啊那这种方式我们经常会会怎么用啊，这是一种用法，有的时候我们还会怎么用啊，咱们假设什么情况啊，假设啊，那我们知道了，我们实际上我们会发现，当我们去兼容一个浏览器的时候，尤其是兼容IE6还有IE8的时候，我们要额外的做做很多的工作，对吧？哎，做很多工作，所以现在我们一般开发的时候，如果公司让你去兼容IE浏览器的话，一般干嘛呀，它不会说让你完美兼容，什么叫完美兼容的，也就是说在IE浏览器里干嘛呢？我们要保证我们的网页可以正常的浏览啊，可以正常的浏览，但是干嘛呢，有一些动态的效果可能在IE里干嘛了呀。

就体现不出来了啊，就体现不出来了，那这块呢，往往我们会怎么做呢？往往我们会准备两个样式表，一个是什么呢。看一个SS啊，我们这个是什么呀，Style，呃，style.css这个什么呢？咱们简单写一下，我里边就设置一个样式，来一个什么呢？来一个body，我们来一个background color，我来一个什么呀，井号BFA啊井号BFA，我是不是设这么一个背景颜色呀，哎，没有别的意思，我就干嘛呀，就是通过它我们来看看它是否生效啊，是否生效来这里边我来一个什么呢？来一个link link，我来引入这个CSS，然后我们在火狐里一运行，诶是不是一个绿色背景出来了，诶绿色背景出来了，但是呢，我们往往干嘛呢？为了去兼容我们这个IE浏览器，往往我需要再单独的去创建一个CS文件，可能改一个名叫什么呢？Style style一个什么呢？Style，一个IE，哎，或者什么呢？或者更直白一点，这是我们的IEIE8，诶这个样式表专门干嘛呀，专门给IE8去设置的，为什么呀，因为我们需要兼容IE8，可能在IE8里我需要需要置一些什么呀，设置一些特殊的样式，那比如说我们就举个例子啊，我这来一个井号FF0，我这。

需要设置一个什么呀，设置一个黄色背景，换句话说，在其他浏览器里我要设置一个什么呀，绿色的，在IE8里我需要设置什么呀？设置一个黄色，但是注意啊，现实里边没有这个需求，我这只是什么呀，模拟的啊模拟的，那问题就来了，那在IE8里我需要使用这个样式表，而在其他浏览器里我是不是需要使用这个样式表啊？哎，那怎么办？那我一想干脆咱们先干嘛呀，我先把IE8这个也给他引进来的，那现在问题来了，我是不是同时引入两个样式表啊，这个样式表是给什么呀？其他浏览器用的，而这个样式表是给谁用的呀？给给I8用的，但是现在这个效果我们来看什么效果走，你是不是都变黄了，为什么？是不是下边这优先生效啊，诶优先生效那怎么办呀，我希望他只对IE8有用怎么办呀？诶是不是给它放在一个条件注释里啊，诶来一个CTRL鞋盖，Alt鞋盖啊来这来一个if爱E8，然后把这东西放进去，那也就意味着这个东西只会在哪引入。

II8里引入在我们火狐里走你是不是还是这个颜色，在我们这个里是不是也也是这个颜色呀，哎，来再看我们这个IE8走你是不IE8是黄色呀，I28是黄色啊，所以通过这种方式可以干嘛呢？可以单独的去给我们IE干嘛呀，设置一个什么呀，专门的一个样式表，就是专门来解决它的一个兼容性问题的啊兼容性问题好，那这个呢，是我们说的一个条件的，Hi，我们来停一下。