123 votes

Quel CSS HTML5 réinitialise utilisez-vous et pourquoi?

Quel CSS HTML5 réinitialise utilisez-vous et pourquoi? Y en a-t-il un que vous avez trouvé pour couvrir plus de cas?

J'ai commencé à utiliser HTML5 Doctor's: http://html5doctor.com/html-5-reset-stylesheet/ Cela semble fonctionner, mais je me demande s'il y a quelque chose de mieux.

40voto

Julien Etienne Points 1202

Real talk: Malgré les démarques kaikai est vrai, vous avez seulement besoin de réinitialiser *padding et margin à 0.

Mais malheureusement, 99% d'entre nous n'ont pas les moyens ou le pouvoir de l'homme de garder en place avec les centaines de versions de navigateur. Si une réinitialisation de la feuille est essentiel pour le site web classique.

html5reset: (C'est trop interférer)

J'ai juste pris un coup d'oeil à http://html5reset.org/

img,
object,
embed {max-width: 100%;}

Et:

html {overflow-y: scroll;}

Je comprends qu'il a de bonnes intentions mais qui n'est pas le travail d'une réinitialisation de la feuille. C'est faire trop d'hypothèses.

Plan de Réinitialisation:(littéralement un plan directeur)

body {
  line-height: 1.5;
  background: white;
}

Whats up avec la 1.5. Et pourquoi fond blanc?(Je sais que c'est pour la correction, mais pas nécessaire)

Normaliser.css: (Pas normal)

https://github.com/necolas/normalize.css/blob/master/normalize.css

Il a commencé bons, avec des webkit/ie hacks mais

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

h2 {
    font-size: 1.5em;
    margin: 0.83em 0;
}

h3 {
    font-size: 1.17em;
    margin: 1em 0;
}

h4 {
    font-size: 1em;
    margin: 1.33em 0;
}

h5 {
    font-size: 0.83em;
    margin: 1.67em 0;
}

h6 {
    font-size: 0.75em;
    margin: 2.33em 0;
}

Chaque balise d'en-tête est ciblée. et ils n'ont pas de réinitialisation de la hauteur de la ligne du corps.

Je suis sûr que tous les ci-dessus ne le travail prévu bien, mais sera probablement remplacée plus que nécessaire.

Eric Meyer

YUI

HTML5Boilerplate

Le ci-dessus sont plus pour les pros avec passe-partout tendance à l' (plus convivial), je suis sûr qu'en raison de la popularité. Au moment où 80% de mes personnalisé reset est réutilisable.

Je vais aller même si tous trois peu à peu et de faire mon propre, ce n'est pas la science de fusée.

38voto

triptych Points 141

Voici deux que vous pourriez essayer:

http://html5reset.org/

http://html5boilerplate.com

19voto

Matt Smith Points 447

Normaliser.css est idéal pour les ordinateurs de bureau et les navigateurs mobiles et est utilisé dans de nombreux populaire, les modèles HTML.

Mais qu'en utilisant le CSS all de la propriété qui réinitialise les propriétés CSS à l'exception de direction et unicode-bidi? De cette façon, vous n'avez pas besoin d'inclure tous les autres fichiers:

* { all: unset }

Il est actuellement pris en charge dans les navigateurs Firefox et j'espère que d'autres suivront rendre le processus de réinitialisation de très simple.

6voto

calvinf Points 2010

La réinitialisation.css utilisé par Blueprint CSS framework fonctionne bien et inclut des éléments HTML5. Il est inclus dans leur écran.css fichier.

Plan est une ressource utile pour le prototypage rapide de nouveaux sites, et dont le code source est bien organisé et de la valeur de l'apprentissage.

4voto

Illes Peter Points 323

Eric Meyer a également publié la v2 de sa réinitialisation CSS (et il l'a fait il y a presque un an maintenant):

http://meyerweb.com/eric/tools/css/reset/

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X