gpt4 book ai didi

css - LESS work around,网格系统,box-sizing

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

不幸的是,我必须开发一个支持 IE7 的站点。

我们知道IE7不支持box-sizing:border-box;这让我在 IE7 样式表中分别为每个元素指定宽度。

我想在我的 grid.less 中写一些逻辑,以便为 ie7.. 相应地计算宽度

如下图

.grid{
width:/*width for modern browsers */;
*width:/*calculate width for ie7 */;
}

请帮助或指出任何资源....谢谢

最佳答案

LESS 没有允许您定位特定浏览器的功能。

执行此操作的标准方法是使用单独的样式表:

<link rel="stylesheet" type="text/css" media="screen" href="css/grid.css"  />
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" media="screen" href="css/ie7-grid.css" />
< ![endif]-->

但是您可以使用类似以下的方法 from Paul Irish :

html...

<!--[if lt IE 7]>      <html class="ie6"> <![endif]-->
<!--[if IE 7]> <html class="ie7"> <![endif]-->
<!--[if IE 8]> <html class="ie8"> <![endif]-->
<!--[if gt IE 8]><!--> <html> <!--<![endif]-->

少...

.grid{
width:/*width for modern browsers */;
.ie7 & {
width:/*calculate width for ie7 */;
}
}

...这应该导致像...这样的 css

.grid{
width:/*width for modern browsers */;
}

.ie7 .grid{
width:/*calculate width for ie7 */;
}

关于css - LESS work around,网格系统,box-sizing,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22190059/

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