Question

我正在尝试设置一些css选择器，我需要设置几个我想在IE8中被忽略的（实际上任何IE＆lt; IE9，但没关系）。

我知道所有浏览器（包括IE9）都支持选择器但是IE8失败了，我可以安全使用哪个选择器？

换句话说，我希望做一些像

这样的事情

.someselectorthatfailsinie .mystyle { stuff for new browsers }

编辑：我想用CSS做的是目标和样式复选框和单选按钮。虽然IE8支持这种处理 - 自定义框 - 但它不支持伪复选框工作所需的input[type=checkbox]:checked + label:before。

因此我想从IE8“隐藏”整个css工作，并让它显示默认的无样式复选框。

Answer 1

有很多东西，即无法处理，我通常会这样做：

.no-boxshadow .classname {border：1px solid #ddd}

转到http://caniuse.com/查看IE 8无法处理的内容。

VenomVendor回答的问题是.noie .mystyle依赖于javascript来启用它以用于大多数现代的浏览器。这是很多工作。只需为现代浏览器设计您的网站，然后使用功能检测来处理旧浏览器。

最好添加一个条件语句并且只针对ie8或ie9，我的html看起来像这样，基于Boilerplate并避免将IE置于兼容模式。 IE10及以上版本无法识别条件评论。

<!--[if IE ]><![endif]-->
<!doctype html>
<!--[if IE 8 ]> <html class="no-js lt-ie9 ie8" lang="en"> <![endif]-->
<!--[if IE 9 ]> <html class="no-js lt-ie10 ie9" lang="en"> <![endif]-->
<!--[if (gte IE 10)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>

然后，如果我想获得ie8，我可以这样做：

.ie8 .class {styles for ie8}

或IE 8及

.lt-ie9 .class {styles for less than ie 9}

Answer 2

为高于IE8＆amp;的浏览器添加noie课程其他broswers。

<!DOCTYPE html>
<!--[if lt IE 8]><html lang="en" class="no-js dumbie"><![endif]-->
<!--[if (gt IE 8)|!(IE)]><!-->
<html class="no-js noie" lang="en">
<!--<![endif]-->
<head>

.noie .mystyle { stuff for new browsers }

Answer 3

要回答原始问题，IE8不支持canvas元素。 Modernizr会将canvas类添加到现代浏览器的<html>标记中，或者，它将为IE8及更低版本添加no-canvas类。因此，您可以这样做以定位现代浏览器：

.canvas .my-checkbox-style { /* CSS for modern browsers, but not IE8 or lower */ }

或者，您可以执行此操作以定位IE8并降低：

.no-canvas .my-checkbox-style { /* CSS for IE8 or lower */ }

然而，这里有一些值得进一步提及的事情......

浏览器不会尊重他们不支持的CSS选择器和属性。

如果打算从IE8中真正隐藏您的现代浏览器CSS，您需要通过条件语句完全提供单独的样式表，如下所示：

    <!--[if lt IE 9]>
      <link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
    <![endif]-->

    <!--[if gt IE 8]>
      <link rel="stylesheet" type="text/css" href="ie9-and-up.css" />
    <![endif]-->

    <!--[if !IE]><!-->
      <link rel="stylesheet" type="text/css" href="non-ie-browsers.css" />
    <!--<![endif]-->

从架构上讲，假设现代浏览器是“一流的公民”。在你的造型目标中，你的样式表应该从他们的现代视角作为一种规范来编写。这将使您的整体开发过程变得更加容易，并且整洁的课程不必要地瞄准现代化的课程。浏览器。使用no-canvas类定位IE8及以下版本，并覆盖其中的现代浏览器CSS，以将IE8复选框返回到其默认状态。然后，您可以在删除IE8支持时轻松地从CSS代码库中删除这个自包含的重载。

我已经写了Codepen example来说明canvas和no-canvas的用法。

Answer 4

我发现 ES5数组方法可用于检测IE8及更低版本。我碰巧在我的代码中使用了forEach。 http://caniuse.com/#search=ECMAScript%205

使用 Modernizr ，您可以检查CSS中的example.file.folder=file:/Users/XXXX/assets/tables/overage example.file=${example.file.folder}/test1.xls example.template.file=${example.file.folder}/test2.xls example.mapping.file=${example.file.folder}/test3.properties或.no-es5array以及JS中的.es5array。 https://modernizr.com/download?es5array-dontmin-setclasses&q=es5array

哪个现代化测试将针对IE8？

4 个答案: