Comme d'autres l'ont déjà mentionné, HTML 4, il faut l' <style> balise à placer dans la <head> section (même si la plupart des navigateurs acceptent <style> balises à l'intérieur de l' body).
Toutefois, HTML 5 comprend l' scoped d'attribut, ce qui vous permet de créer des feuilles de style qui sont limités à l'intérieur de l'élément parent de l' <style> balise. Cela vous permet également de placer <style> balises à l'intérieur de l' <body> élément:
<!DOCTYPE html>
<html>
<head></head>
<body>
<div id = "scoped-content">
<style type = "text/css" scoped>
h1 { color: red };
</style>
<h1>Hello</h1>
</div>
<h1>World</h1>
</body>
</html>
Si vous utilisez le code ci-dessus dans un HTML-5 est activé sur votre navigateur qui prend en charge scoped, vous allez voir de la portée limitée de la feuille de style.
Il y a juste un majeur de mise en garde...
Au moment où j'écris cette réponse (Mai 2013) presque pas d'intégrer le navigateur prend actuellement en charge l' scoped d'attribut. (Bien que, apparemment, les versions en développement de Chrome en charge.)
CEPENDANT, il y a une implication intéressante de l' scoped attribut se rapportant à cette question. Cela signifie qu'à l'avenir les navigateurs sont mandatés par la norme afin de permettre l' <style> des éléments au sein de l' <body> (tant que l' <style> des éléments sont limités.)
Donc, étant donné que:
- Presque tous les navigateurs existant actuellement ignore l'
scoped d'attribut
- Presque tous les navigateurs existant permet actuellement d'
<style> balises à l'intérieur de l' <body>
- Les futures implémentations seront nécessaires pour permettre (étendue)
<style> balises à l'intérieur de l' <body>
...puis il n'y a littéralement pas de mal* en plaçant <style> tags à l'intérieur du corps, aussi longtemps que vous le futur avec un scoped d'attribut. Le seul problème, c'est que les navigateurs actuels ne limite le champ d'application de la feuille de style - ils vont les appliquer à l'ensemble du document. Mais le point est que, à toutes fins pratiques, vous pouvez inclure <style> balises à l'intérieur de l' <body> condition de:
- L'avenir de votre HTML en incluant l'
scoped d'attribut
- Comprendre que, dès maintenant, la feuille de style à l'intérieur de l'
<body> ne sera pas étendue (car pas d'intégrer la prise en charge du navigateur existe encore)
* sauf bien sûr, pour emmerder le HTML validateurs...
Enfin, concernant la commune (mais subjective) affirment que le fait d'intégrer le CSS dans le HTML est une mauvaise pratique, il convient de noter que le point de l'ensemble de l' scoped attribut est pour accueillir moderne typique des cadres de développement qui permettent aux développeurs d'importer des morceaux de HTML sous forme de modules ou de contenu syndiqué. Il est très pratique d'avoir CSS intégré qui seule s'applique à un morceau de code HTML, dans le but de développer encapsulé, composants modulaires spécifiques stylings.
