Hey everyone! I have a simple question about HTML. Why do we use the `href` attribute in the link tag to include external CSS files, like this: ``, instead of using `src` like we do with the script or img tags?
After doing some research, I think I understand that the `href` attribute doesn't block the parsing of the rest of the HTML document. This allows the CSS file to be downloaded in parallel while the main thread continues parsing the HTML. In contrast, the `src` attribute makes the main thread stop and wait for the resource to load, which affects the parsing of the HTML. However, I've realized I was mistaken about the img tag not blocking parsing—it actually doesn't, but scripts do. So, I get that the img tag uses `src` because it's embedded directly. If I'm missing anything or if my understanding is off, please let me know!
3 Answers
Check out this link that explains the difference: https://stackoverflow.com/questions/3395359/difference-between-src-and-href/7794936#7794936. It helped clarify things for me!
Don’t stress about it! You’ll encounter a lot of such questions in web development. Soon enough, things like using `to` or `[routerLink]` will pop up, and you'll be wondering why those aren’t used too.
The `href` attribute is meant for referencing resources like stylesheets, while `src` is for embedding things like images or scripts directly into the document. The `link` tag simply associates the CSS file without embedding it directly, which is why `href` makes sense here.
Thanks for the link! I’ll definitely look into Stack Overflow more. I haven’t gotten good answers from AI yet.