web-dev-qa-db-fra.com

<link> vs <a>: quand utiliser l'un sur l'autre?

J'ai une certaine confusion entre <link> et <a>.

Je sais que pour ajouter du CSS à un document HTML, nous utilisons le <link> tag, par exemple:

<link type="text/css" rel="stylesheet" href="/spinner/styles.css?ln=css" />

Mais, je ne comprends pas pourquoi nous n'utilisons pas d'ancrage <a> tag (car il contient les mêmes attributs nécessaires), quelque chose comme:

 <a type="text/css" rel="stylesheet" href="/spinner/styles.css?ln=css" />

Ces deux étiquettes sont-elles interchangeables? De plus, si cela est possible, comment choisissons-nous l'un plutôt que l'autre et pourquoi?

Mise à jour:

J'ai eu cette confusion, car j'ai vu dans le livre de référence complet HTML & CSS concernant l'attribut rel du <a> Tag, que:

rel: pour les ancres contenant l'attribut href, cet attribut spécifie la relation entre l'objet cible et l'objet lien.

J'ai donc pensé qu'il pourrait faire la même fonction que le <link> tag.

29
Tarik

Les attributs ne sont pas les mêmes que la balise dans laquelle ils se trouvent.

<link /> est un élément vide , c'est-à-dire qu'il ne peut rien contenir à l'intérieur. Il ne fait que spécifier une relation avec un autre document. De plus, le <link> la balise n'est utilisée que dans le <head> section.

<a></a> d'autre part, n'est pas un élément vide et spécifie un objet à créer sur la page - comme un lien ou une image cliquable - qui emmène l'utilisateur vers un autre emplacement. Cette balise est uniquement utilisée dans le <body> section.

Ainsi, même si les balises peuvent avoir les mêmes attributs, cela ne signifie pas qu'elles font la même chose.

34
Jon Egeland

Vous ne pouvez pas utiliser une balise A pour ajouter des CSS au document HTML car elle est destinée à créer des hyperliens cliquables entre les documents.

Mais si vous souhaitez créer un lien permettant aux utilisateurs de télécharger un fichier css, vous pouvez le faire

<a type="text/css" rel="stylesheet" href="/spinner/styles.css?ln=css">Download css</a>
9
Piotr Perak

Yup Jon a raison,

Un autre ajout à sa réponse est:

N'importe quoi dans <a>insideanchortag</a> est visible par l'utilisateur final

Mais vous ne pouvez pas voir le <link /> données dans la vue de l'utilisateur final, elles ne sont visibles que dans l'élément inspect.

7
Akilsree1