Могу ли я включить условные комментарии IE в открывающий тег? - PullRequest
Новая
       9

Могу ли я включить условные комментарии IE в открывающий тег?

2 голосов
/ 20 августа 2010

В общем, я хотел бы знать, в порядке ли этот код, 

<body id="some_id" <!--[if lt IE 7 ]>class="ie6"<![endif]--> >
</body>

Ответы [ 4 ]

6 голосов
/ 20 августа 2010

Нет.HTML-комментарии не могут быть внутри тега.Попробуйте: 

<!--[if gte IE 7]>--> <body id="some_id"> <!--<![endif]-->
<!--[if lt IE 7]> <body id="some_id" class="ie6"> <![endif]-->
2 голосов
/ 20 августа 2010

Нет, и это не обязательно. Всегда передавайте класс элементу body и оставляйте определение CSS .ie пустым для всех браузеров, кроме IE6: 

.ie6 {
<!--[if lt IE 7]-->
    ... ugly ie6 hack ...
<!--[endif]-->
}
</style>
<body class="ie6">
1 голос
/ 20 августа 2010

Нет - комментарии не могут быть вставлены в теги.

0 голосов
/ 05 апреля 2016

Нет, вы не можете, поэтому вам придется повторить тег и все его атрибуты.

Многие люди добавляют класс идентификатора браузера в тег <html>.Использование тега body также хорошо, но я бы использовал тот тег, который имеет наименьшее количество символов в своих атрибутах.

WordPress тег 'body' может выглядеть следующим образом

<body class="home page page-id-38 page-template page-template-template-homepage page-template-template-homepage-php woocommerce-demo-store storefront-full-width-content right-sidebar woocommerce-active has-site-logo">

Таким образом, вы должны поместить класс в тег <html>, чтобы сохранить повторение этой длинной строки.

<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie6"<![endif]-->
<!--[if IE 7 ]>    <html class="ie7"<![endif]-->
<!--[if IE 8 ]>    <html class="ie8"<![endif]-->
<!--[if IE 9 ]>    <html class="ie9"<![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->
    <head>
    </head>
    <body class="home page page-id-38 page-template page-template-template-homepage page-template-template-homepage-php woocommerce-demo-store storefront-full-width-content right-sidebar woocommerce-active has-site-logo">

Тег html может выглядеть следующим образом.

<html class="" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#" itemscope itemtype="http://schema.org/Webpage">

В этом случае вы можете поместить класс в тег <body>. 

<!DOCTYPE html>
<html lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#" itemscope itemtype="http://schema.org/Webpage">
    <head>
    </head>
    <!--[if lt IE 7 ]> <body class="ie6"><![endif]-->
    <!--[if IE 7 ]>    <body class="ie7"><![endif]-->
    <!--[if IE 8 ]>    <body class="ie8"><![endif]-->
    <!--[if IE 9 ]>    <body class="ie9"><![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--> <body> <!--<![endif]-->

Если бы у меня было что-то, что оставляло мне не опцион, а многократно повторять огромную строку, как это.

<!DOCTYPE html>
<html class="" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#" itemscope itemtype="http://schema.org/Webpage">
<head>
</head>
<body class="home page page-id-38 page-template page-template-template-homepage page-template-template-homepage-php woocommerce-demo-store storefront-full-width-content right-sidebar woocommerce-active has-site-logo">

Тогда я бы, вероятно, использовал javascript 

<!DOCTYPE html>
<html class="" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#" itemscope itemtype="http://schema.org/Webpage">
<head>
<script>
    (function(){
        var d=document,
            h=d.documentElement,
            v = 3,
            p = d.createElement('p'),
            i = p.getElementsByTagName('i'),
            u;
            while (
                p.innerHTML =  '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
                i[0]
            );
            h.className += (v > 4 ? ' ie'+v : '');
    })()
</script>
</head>
<body class="home page page-id-38 page-template page-template-template-homepage page-template-template-homepage-php woocommerce-demo-store storefront-full-width-content right-sidebar woocommerce-active has-site-logo">

Этот сценарий является модифицированной версией сценария Джеймса Падолси, который добавляет класс к htmlтег.

...