gpt4 book ai didi

css - 从 bootstrap.css 创建非响应式 CSS

转载 作者:太空宇宙 更新时间:2023-11-04 04:22:04 25 4
gpt4 key购买 nike

由于 IE <8 和其他一些次要浏览器不支持 @media 查询,我想通过模拟特定宽度(如 1200px)为不受支持的浏览器创建一个 CSS,并将其导出为一个非响应式 CSS 文件以供使用这些浏览器。是否有任何工具或其他简单的方法可以实现这一目标?

编辑:我正在使用 Twitter Bootstrap 3

最佳答案

不支持 Bootstrap 3 和媒体查询 - ie7。即使您使用任何类似 Respond.js 的 polyfill,您也可以让 IE6-8 响应媒体查询。但是bootstrap-3.0是mobile-first的设计方式,不支持ie7。但是如果您在媒体查询之外定义所有实际设计,一切都应该没问题。它将在所有浏览器上运行。如果你真的想支持ie7,那就用bootstrap 2.*

像这样在您的 html 中使用条件语句:

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">

然后通过以下方式定位您的浏览器:

.lt-ie9  .btn-nav
{
//for ie 8 only, change following.
margin: 0;
display: inline-block;
}
.lt-ie8 .btn-nav{
// for ie 7
background: white;
}

或者只是简单地定义您的标准 css,它应该适用于文件顶部的所有浏览器而无需媒体查询。这应该是编写 css 的首选方式,并结合了上述良好做法。

use a polyfill like Respond.js使媒体查询适用于 ie6-8

关于css - 从 bootstrap.css 创建非响应式 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18899712/

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