gpt4 book ai didi

css - 将浏览器特定条件放入 CSS 选择器

转载 作者:行者123 更新时间:2023-12-02 05:42:36 26 4
gpt4 key购买 nike

我有以下 CSS 选择器

 body
{
margin: 0;
font-family: "Arial" ;
font-size: 18px;
line-height: 25px;

}

我想编写条件,如果浏览器是 IE,则将 line-height 更改为 10px

我搜索了一个类似的问题here但是当我添加问题中提到的条件时它抛出语法错误 Missing property name before colon(:)。我按照问题修改了代码,例如

    .bodyClass
{
margin: 0;
font-family: "Arial";
font-size: 18px;
line-height: 25px;

<!--[if IE 6]>
line-height: 10px;
<![endif]-->

}

css选择器里面的条件语句怎么写?我不想为 IE 和其他浏览器创建不同的样式表

最佳答案

如果您不想创建单独的样式表,那么您有两种选择。

IE 条件注释

使用条件注释为 <html> 赋予类标记,例如:

<!--[if lt IE 7]>  <html class="ie ie6 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 7]> <html class="ie ie7 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 8]> <html class="ie ie8 lte9 lte8"> <![endif]-->
<!--[if IE 9]> <html class="ie ie9 lte9"> <![endif]-->
<!--[if gt IE 9]> <html> <![endif]-->
<!--[if !IE]><!--> <html> <!--<![endif]-->

这样您就可以在 CSS 中使用像这样的自描述选择器:

html.ie6 .bodyClass { line-height: 10px}

CSS 技巧

另一种选择是使用合适的 CSS hacks以您感兴趣的浏览器为目标。这种方法的优点是它可以在根本不接触 HTML/DOM 的情况下完成。一种仅针对 IE 6 同时在语法上仍然有效的 CSS 的特定 hack 是:

.bodyClass { _line-height: 10px; /* hack targeting IE 6 only */ } 

如果您确实决定使用 CSS hack,请确保附上评论,说明他们为帮助 future 的维护者所做的工作。

关于css - 将浏览器特定条件放入 CSS 选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19291985/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com