gpt4 book ai didi

css - 如何设置
样式使其无效?

转载 作者:行者123 更新时间:2023-11-28 12:14:12 24 4
gpt4 key购买 nike

是否可以设置 div 的样式使其对布局没有影响?(好像标签不存在于 html 中一样)

我问的原因是我正计划为 ie7、ie8 和 ie9 上的 css3 多列布局创建一个解决方法。

在这些版本的 ie 上,列将使用垂直 div 实现。但是,在支持 css3 列的浏览器上,我希望这些 div 的效果为零(但是在 ie 上,我将覆盖它以创建列)。我可以创建一个执行此操作的 css 类吗?

例如

<div class="noeffect">
<div class="item">item1</div>
<div class="item">item2</div>
</div>

<div class="noeffect">
<div class="item">item3</div>
<div class="item">item4</div>
</div>

<div class="noeffect">
<div class="item">item5</div>
<div class="item">item6</div>
</div>

因此在 IE 上可以覆盖“noeffect”以显示 3 列,但是在其他浏览器上,可以使用多列布局来显示 1、2、3、4、5 或 6 列。

最佳答案

IE7、IE8 和 IE9 支持所谓的 conditional comments。 .这些允许您仅在 IE 浏览器匹配条件时包含特定内容。

Internet Explorer 的条件注释

请注意,这些已在 IE11 中删除,即使通过 IE11 的开发人员工具模仿旧版本的 IE 也不会呈现。

在您的情况下,我们可以使用 if lte IE 9 来匹配任何小于或等于 (lte) IE 9 的 IE 版本,以加载特定于 IE 的样式表:

<!--[if lte IE 9]>
<link rel="stylesheet" href="IE-Specific-CSS.css">
<![endif]-->

此样式表将覆盖常规 CSS 文件中的内容。您的 head 元素最终会看起来像这样:

<head>
<title>...</title>

<link rel="stylesheet" href="Regular-CSS.css">
<!--[if lte IE 9]>
<link rel="stylesheet" href="IE-Specific-CSS.css">
<![endif]-->
</head>

所有非 IE9 以下版本的浏览器只会加载 Regular-CSS.css 文件,而 IE9 及更低版本会同时加载 Regular-CSS.css IE-Specific-CSS.css。然后下降到specificity允许 IE 特定的 CSS 声明覆盖其他 CSS 文件的声明。

示例 CSS

/* Regular-CSS.css */
div.noeffect {
background: #f00; /* Red background */
}
/* IE-Specific-CSS.css */
div.noeffect {
background: #0f0; /* Green background only on IE9 and lower */
}

上面的两个选择器(div.noeffect)具有相同的特异性(上面有链接),所以只要加载我们的IE专用CSS文档就可以了我们的常规 CSS 文档之后,特定于 IE 的 CSS 将覆盖常规 CSS。

仅在 IE9 或更低版本中呈现 div 元素

如果您希望那些 div 元素只出现在 IE9 或更低版本上,您可以将条件注释包裹在每个 div 标签周围:

<!--[if lte IE 9]>
<div class="noeffect">
<![endif]-->
<div class="item">item1</div>
<div class="item">item2</div>
<!--[if lte IE 9]>
</div>
<![endif]-->

<!--[if lte IE 9]>
<div class="noeffect">
<![endif]-->
<div class="item">item3</div>
...

关于css - 如何设置 <div> 样式使其无效?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25422304/

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