htmlhyperlink

<link> vs <a>: when to use one over the other?

I have some confusion between <link> and <a>.

I know that in order to add CSS to an HTML document we use the <link> tag, for example:

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

But, I can't understand why we do not use an anchor <a> tag (as it contains the same necessary attributes), something like:

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

Are these two tags interchangeable? Also, if this is possible, then how do we choose one over the other and why?

Update:

I got that confusion, because I saw in The Complete Reference HTML & CSS book regarding the rel attribute of the <a> Tag, that:

rel: For anchors containing the href attribute, this attribute specifies the relationship of the target object to the link object.

So I thought that it could do the same function as the <link> tag.

Solution

  • Attributes are not the same as the tag they are in.

    <link /> is an empty element, i.e. it can not have anything inside of it. All it does is specify a relationship with another document. Additionally, the <link> tag is only used in the <head> section.

    <a></a> on the other hand, is not an empty element and specifies an object to be created on the page - like a clickable link or image - which takes the user to some other location. This tag is only used in the <body> section.

    So, even though the tags can have the same attributes, that does not mean they do the same thing.