HTML 5 no admite atributos como frameborder, scrolling, marginwidth y marginheight (que eran compatibles con HTML 4.01). En cambio, la especificación HTML 5 ha introducido el atributo sin costuras. El atributo sin costura permite que el marco en línea aparezca como si se estuviera renderizando como parte del documento que lo contiene. Por ejemplo, los bordes y las barras de desplazamiento no aparecerán.
Según MDN
frameborder
Obsoleto desde HTML5
El valor 1
(predeterminado) dibuja un borde alrededor de este marco. El valor 0
elimina el borde alrededor de este marco, pero debería usar el borde de la propiedad CSS para controlar los bordes.
Como dice la cita anterior, debe eliminar el borde con CSS;
ya sea en línea ( style="border: none;"
) o en su hoja de estilo ( iframe { border: none; }
).
Dicho esto, no parece haber un solo proveedor de iframe que no utilice frameborder="0"
. Incluso YouTube todavía usa el atributo y ni siquiera proporciona un atributo de estilo para hacer que los iframes sean compatibles con versiones anteriores cuando ya no se admite frameborder. Es seguro decir que el atributo no desaparecerá pronto. Esto te deja con 3 opciones:
- Sigue usando
frameborder
, solo para asegurarte de que funciona (por ahora)
- Usa CSS para hacer lo "correcto"
- Utilice ambos. Aunque esto no resuelve el problema de incompatibilidad (al igual que la opción 1), sí funciona y funcionará en todos los navegadores que han sido y serán
En cuanto al estado anterior de esta respuesta de una década:
El seamless
atributo ha sido admitido durante tan poco tiempo (o no lo han admitido algunos navegadores), que MDN ni siquiera lo enumera como una característica obsoleta. No lo use y no se confunda con los comentarios a continuación.
border-width: 0px;
, pero me temo que tampoco es compatible con todos los navegadoresiframes
.seamless
todavía no es compatible con todos los navegadores. Este es uno de esos pocos problemas de HTML5 que debe aceptar. ¡Usaframeborder="0"
y al diablo con la validación!seamless
se ha eliminado de la especificación HTML5, por lo que nunca será compatible. La respuesta de @ ForTheWatch es ahora la mejor.Según la otra publicación aquí , la mejor solución es usar la entrada CSS de
style="border:0;"
fuente
border-width: 0px
TBH.border: none;
no trabajará.I test for the crappy browsers, because if it works in them, than it is almost sure to work in the others.
Dios mío, ese ingenuo. Si desea asegurarse de que su aplicación funcione en un navegador, debe probar en ese navegador, simple y llanamente. No hay garantías, solo peculiaridades.seamless
se ha eliminado de la especificación, esta es la única respuesta correctaDado que el
frameborder
atributo solo es necesario para IE, hay otra forma de sortear el validador. Esta es una forma liviana que no requiere Javascript ni ninguna manipulación DOM.<!--[if IE]> <iframe src="source" frameborder="0">?</iframe> <![endif]--> <!--[if !IE]>--> <iframe src="source" style="border:none">?</iframe> <!-- <![endif]-->
fuente
frameBorder="0"
si no desea un borde alrededor de un marco en línea.frame
yframeset
noiframe
. El atributo está obsoleto en eliframe
elemento; ver w3.org/TR/html5/obsolete.html#attr-iframe-frameborderEsto funciona
iframe{ border-width: 0px; }
fuente
¿Qué tal si usamos la misma técnica para "engañar" al validador con Javascript pegando un atributo de destino en XHTML
<a onclick="this.target='_blank'">
?<iframe onload = " this.frameborder='0' " src="menu.html" id="menu"> </iframe>
O
getElementsByTagName]("iframe")
1 añadiendo este atributo para todos los marcos flotantes en la página?¡No he probado esto porque hice algo que significa que nada funciona en IE menos de 9! :) Entonces, mientras estoy resolviendo eso ... :)
fuente
Encontré una buena solución que le permitirá funcionar en IE7 aquí . Omite el validador para el atributo frameBorder pero mantiene css para futuros navegadores como se explica en la publicación.
fuente
seamless
atributo en su lugar.style="border:none; scrolling:no; frameborder:0; marginheight:0; marginwidth:0; "
fuente