HTML5 et frameborder

Question

J'ai un iframe dans un document HTML5. Lorsque je valide, j'obtiens une erreur qui me dit que l'attribut de l'iframe n'est pas valide. iframe frameBorder est obsolète et d'utiliser CSS à la place.

J'ai cet attribut frameBorder="0" ici parce que c'est la seule façon que j'ai trouvée pour me débarrasser de la bordure dans IE, j'ai essayé border:none; en CSS, sans succès. Existe-t-il un moyen simple de résoudre ce problème ?

Gracias.

Answer 1

HTML 5 ne prend pas en charge des attributs tels que frameborder, scrolling, marginwidth et marginheight (qui étaient pris en charge dans HTML 4.01). En revanche, la spécification HTML 5 a introduit l'attribut seamless. L'attribut seamless permet au cadre en ligne d'apparaître comme s'il était rendu en tant que partie du document contenant. Par exemple, les bordures et les barres de défilement n'apparaissent pas.

Selon MDN

frameborder Obsolète depuis HTML5

La valeur 1 (par défaut) dessine une bordure autour de ce cadre. La valeur 0 supprime la bordure de ce cadre, mais vous devriez plutôt utiliser la propriété CSS border pour contrôler les bordures.

Comme le dit la citation ci-dessus, vous debe supprimer la bordure avec CSS ;
soit en ligne ( style="border: none;" ) ou dans votre feuille de style ( iframe { border: none; } ).

Ceci étant dit, il ne semble pas y avoir un seul fournisseur d'iframe qui n'utilise pas frameborder="0" . Même YouTube utilise encore cet attribut et ne fournit même pas d'attribut de style pour rendre les iframes rétrocompatibles lorsque frameborder n'est plus pris en charge. On peut dire que l'attribut n'est pas prêt de disparaître. Il ne vous reste donc que trois options :

1. Continuez à utiliser frameborder juste pour être sûr que cela fonctionne (pour l'instant).
2. Utilisez les CSS, pour faire la "bonne" chose
3. Utilisez les deux. Bien que cela ne résolve pas le problème d'incompatibilité (tout comme l'option 1), cela fonctionne et fonctionnera dans tous les navigateurs qui ont été et seront utilisés par le passé.

Quant à l'état antérieur de cette réponse vieille de dix ans :

Le site seamless est pris en charge depuis si peu de temps (voire pas du tout par certains navigateurs) que MDN ne le considère même pas comme une fonctionnalité obsolète. Ne l'utilisez pas et ne vous laissez pas déconcerter par les commentaires ci-dessous.

Answer 2

Conformément à l'autre message aquí la meilleure solution est d'utiliser l'entrée CSS de l'option

style="border:0;"

Answer 3

Depuis le frameborder n'est nécessaire que pour IE, il existe un autre moyen de contourner le validateur. Il s'agit d'une méthode légère qui ne nécessite pas de Javascript ou de manipulation du DOM.

<!--[if IE]>
   <iframe src="source" frameborder="0">?</iframe>
<![endif]-->
<!--[if !IE]>-->
   <iframe src="source" style="border:none">?</iframe>
<!-- <![endif]-->

Answer 4

Que diriez-vous d'utiliser la même technique pour "tromper" le validateur avec Javascript en plaçant un attribut cible dans le XHTML ? <a onclick="this.target='_blank'"> ?

• sur quelque chose \= " this.frameborder = '0' "

<iframe onload = " this.frameborder='0' " src="menu.html" id="menu"> </iframe>

Ou getElementsByTagName]("iframe") 1 ajouter cet attribut pour toutes les iframes de la page ?

Je n'ai pas testé cela parce que j'ai fait quelque chose qui signifie que rien fonctionne dans IE moins de 9 ! :) Donc pendant que je règle ce problème ... :)

Answer 5

J'ai trouvé un contournement qui permet de travailler avec IE7. aquí . Il contourne le validateur pour l'attribut frameBorder mais conserve le css pour les futurs navigateurs comme expliqué dans le post.