www3 examples code bootstrap javascript html css html5 w3c

javascript - examples - html5 tags



Por qué<script src="min.js"></ script> pero<link rel="stylesheet" href="min"> por qué no<style href="min.css"></ style> (6)

Un pariente mío que comenzó a aprender Desarrollo web me hizo esta pregunta.

Por qué <script src="min.js"></script> pero <link rel="stylesheet" href="min.css"> por qué no <style href="min.css"></style> por qué usamos etiqueta de link para agregar css externos en la página pero cuando vinculamos css a la página, pero usamos <style>...</style> cuando escribimos css dentro de <head> ?

Le dije que es por la especificación. ¿Hay más información para darle?


Ambos tienen un significado básicamente idéntico, y has detectado una especie de inconsistencia en HTML. La causa de esto es que los estándares se basaron en las implementaciones de diferentes navegadores. A los navegadores se les ocurrieron los atributos en las diferentes etiquetas, y el W3C simplemente decidió mantener algunas de las incoherencias para mantener la compatibilidad hacia atrás.

Elementos que utilizan src : script img iframe input video frame

Elementos que usan href : a link base


Es histórico ... ¿coincidencia? Puede recomendarle que lea parte sobre el pasado de diveintohtml5.info , donde hay algunas historias interesantes, en realidad correspondencias de correo, entre desarrolladores web. Los desarrolladores web significa que, de hecho , estaban desarrollando la Web que vemos hoy en día;)

Es decir, la etiqueta <img> que estamos acostumbrados:

<IMG SRC="file://foobar.com/foo/bar/blargh.xbm">

podría ser:

<ICON name="NoEntry" href="http://note/foo/bar/NoEntry.xbm">

o

<A HREF="..." INCLUDE>See photo</A>

o

<INCLUDE HREF="...">

pero finalmente los desarrolladores decidieron seguir con <img> , que ya estaba implementado :

No estamos preparados para admitir INCLUDE / EMBED en este momento. ... Así que probablemente vamos a ir con (no ICON, ya que no todas las imágenes en línea se pueden llamar íconos). Por el momento, las imágenes en línea no serán expuestas explícitamente al contenido; en el futuro, planeamos apoyar eso (junto con la adaptación general de MIME). En realidad, las rutinas de lectura de imágenes que estamos usando descifran el formato de imagen sobre la marcha, por lo que la extensión del nombre de archivo ni siquiera será significativa.

No sé la respuesta directa a su pregunta, pero también tengo mucha curiosidad sobre la etiqueta <link> . Encontrar una respuesta probablemente incluya algunos archivos web cavando.



Hay una diferencia, al menos desde el punto de vista del W3C.

Un elemento <style> introduce un bloque de reglas CSS que se aplican al documento actual. Sin embargo, las hojas de estilo externas en realidad se consideran documentos completos related con la página actual, y los agentes de usuario pueden ignorar dichos documentos, según el type y media atributos de media del enlace. Por ejemplo:

<link rel="stylesheet" type="text/css" media="screen" href="screen.css" /> <link rel="stylesheet" type="text/css" media="print" href="print.css" />

En esta situación, los agentes de usuario generalmente solo seguirían uno de los enlaces, ya sea de la screen uno (para el renderizado normal) o el de print (para, bueno, impresión). La idea era preservar el ancho de banda descargando solo el recurso apropiado, en lugar de buscar todo y filtrar en el tipo de medio más tarde.

Esto se menciona en la especificación:

Cuando el elemento LINK vincula una hoja de estilo externa a un documento, el atributo de type especifica el lenguaje de la hoja de estilo y el atributo de media especifica el medio o los medios de reproducción deseados. Los agentes de usuario pueden ahorrar tiempo recuperando de la red solo aquellas hojas de estilo que se aplican al dispositivo actual.


La etiqueta <link> se usa para "vincular" otros documentos con el actual, y describir su relación, o rel , con ella.

También puede usar <link> para vincular otras cosas al documento. Por ejemplo, favicons:

<link rel="shortcut icon" href="favicon.ico" />


Posible razón para el link ref vs. style :

link solo puede ir a la head , donde se permite el "contenido de metadatos", típicamente head ,

style no podía ir en el body antes de HTML5 (ahora puede scoped con el scoped , pero aún no a los estilos externos). Por lo tanto, la elección entre link ref y style src es arbitraria.

script , sin embargo, ya podría incluir un script externo en el body antes de HTML5, por lo que tenía que haber script src . Pero como tenía que existir, ¿por qué no permitirlo también en la head (donde el script ya estaba permitido) y no permitir el link rel=script para evitar la duplicación?