compilateurs CSS et convertir entailles IE pour css conditionnelle [fermée]

StackOverflow https://stackoverflow.com/questions/2746754

Question

Aller en bas pour la question, mais d'abord, un peu le contexte.

Je suis à la recherche dans les compilateurs CSS (comme Sass & moins) pendant un certain temps, et ont été vraiment intéressés à eux, non pas parce qu'ils me aider à comprendre quoi que ce soit plus facile (je l'ai fait css pendant quelques années ) mais ils abattent sur cochonneries et me aider à voir les choses.

J'ai récemment été mise en œuvre en recherche de manière fiable inline-block (et clearfix), qui nécessitent beaucoup de code étranger et hacks. Or, d'après toutes les autorités dans le domaine, je ne devrais pas mettre hacks IE dans la même page que je fais mon CSS, je les conditionner. Mais pour moi, c'est embêtant vraiment grand pour traverser et gérer tout ce code supplémentaire, ce qui est la raison pour laquelle je aime vraiment des choses comme moins. Au lieu d'appliquer des classes unsemantic, vous spécifiez un mixin et appliquez une fois, et vous êtes tous ensemble.

Je suppose que je suis un peu de la piste (je voulais expliquer mes points) mais bascially, je suis au point où ces compilateurs CSS sont très utiles pour moi, et permettez-moi de beaucoup abstrait un des cochonneries loin, et appliquer de manière fiable les fois et puis juste compiler. Je voudrais avoir un moyen d'être en mesure de compiler des styles spécifiques IE dans leurs propres fichiers conditionnels (ala moins / Sass) donc je n'ai pas à traiter de la gestion 2 fichiers sans raison.

Est-ce que quelque chose comme un script / applcation qui fonctionne et peut faire underscore / hacks étoiles en dehors de leur propre exist de fichier?

Était-ce utile?

La solution

Il est pas vraiment un truc du compilateur, mais si vous voulez utiliser des commentaires conditionnels sans avoir à compiler séparés par des feuilles de style-navigateur, vous pouvez simplement utiliser HTML des commentaires conditionnels pour injecter un crochet de style. Par exemple: 

    ...
</head>
<!--[if lte IE 6]><body class="ie6 ie7"><![endif]-->
<!--[if lte IE 7]><body class="ie7"><![endif]-->
<!--[if gte IE 8]><!--><body><!--<![endif]-->

Vous pouvez maintenant cibler les règles que vous souhaitez appliquer à IE <= 6 et IE <= 7 dans la même feuille de style que le reste des règles: 

body.ie6 #thing { position: relative; }
body.ie7 #otherthing { z-index: 0; }

OMI est légèrement plus propre que le hack * html, qui est le dernier hack CSS acceptable. (Le « hack étoiles » et « underscore hack » sont CSS valide: éviter.)

Autres conseils

Vous pouvez simplement conditionnellement une feuille CSS générée pour IE6 / 7 / whathaveyou: 

<head>
    <link rel="stylesheet" href="/css/master.css" type="text/css"/>
    <!--[if IE 6]>
      <link rel="stylesheet" href="/css/ie6.css" type="text/css"/>
    <![endif]-->
</head>

En outre, si vous êtes inquiet au sujet de mélange dans les correctifs IE / hacks avec la majeure partie de votre SASS / CSS, vous pouvez les diviser en leurs propres partials: 

@import ie6.sass

Ce qui précède comprendrait toutes les règles pour cette version particulière de IE dans le document SASS actuel. Documentation sur partials se trouve ici: SASS Partials

  

OMI est légèrement plus propre que le * html hack, qui est le dernier hack CSS acceptable. (Le « hack étoiles » et « underscore hack » sont CSS valide: éviter.)

Pas vraiment: alors que le "underscore hack" est invalide, le "* html" et hacks "+ html" sont parfaitement valide CSS. Vérifiez par vous-même . ;)

~

En ce qui concerne la question ci-dessus, pour l'instant je ne suis pas au courant de tout compilateur capable de le faire, je préfère encore à l'utilisateur le hack de démarrage (IE6-7) et garder tout dans un seul fichier. Plus maintenable.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top