web-dev-qa-db-fra.com

Style d'élément non autorisé en tant qu'enfant du corps de l'élément dans ce contexte (<portée de style> non validé)

<!DOCTYPE html>
...
<style scoped>
/* css */
</style>

Le validateur w3.org me donne cette erreur:

Line 883, Column 17: Element style not allowed as child of element body in this context.
(Suppressing further errors from this subtree.)
        <style scoped>...
Contexts in which element style may be used:
If the scoped attribute is absent: where metadata content is expected.
If the scoped attribute is absent: in a noscript element that is a child of a head element.
If the scoped attribute is present: where flow content is expected, but before any other flow     content other than inter-element whitespace and style elements, and not as the child of an element whose content model is transparent.
Content model for element body:
Flow content.

Je crois comprendre que la propriété 'scoped' permet que la balise de style soit en dehors du début du document. Alors pourquoi le validateur en est-il mécontent?

(J'utilise Wordpress et ce code est produit par un plugin, c'est pourquoi je ne peux pas simplement le mettre dans la tête.)

EDIT: Cela ne valide pas -

<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>title</title>
</head>
<body>
<script type="text/javascript"></script>
<style scoped></style>
</body>
</html>

Mais c'est le cas si la balise script va après la balise style. Quelle est la raison de ceci?

htmlcssw3c-validation
13
mikeybeck

Le validateur de balisage W3C, lorsqu'il agit comme un vérificateur HTML5, gère ce problème en fonction de divers brouillons tels que HTML 5.1 Nightly , qui indique actuellement que l'élément style peut apparaître uniquement à l'intérieur du head élément, sauf lorsque l'attribut scoped est présent, auquel cas il peut apparaître "là où le contenu du flux est attendu, mais avant tout autre contenu de flux autre que les espaces blancs et les éléments de style inter-éléments, et non comme l'enfant d'un élément dont le modèle de contenu est transparent ". Dans votre exemple réel, l'élément apparaît après un élément script (qui est compté comme contenu de flux). Changer l'ordre des éléments change donc la syntaxe en valide, selon la définition donnée.

Alternativement, vous pouvez simplement envelopper l'élément style dans un élément div:

<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>title</title>
</head>
<body>
<script type="text/javascript"></script>
<div>
  <style scoped></style>
</div>
</body>
</html>

L'attribut scoped n'est pas du tout valide selon la recommandation W3C HTML5 . Il était présent dans les brouillons HTML5, mais il a été supprimé de la recommandation en raison du manque d'implémentations, mais il est toujours dans la "voie de la normalisation" et pourrait faire son chemin vers HTML 5.1.

Notez que les navigateurs existants ignorent généralement l'attribut scoped et autorisent un élément style presque n'importe où et appliquent son contenu à l'ensemble du document HTML (même les parties qui précèdent l'élément style).

16
Jukka K. Korpela