What’s the difference between @import and link for adding CSS?

Difference between them is that @import is the CSS mechanism to include a style sheet and <link> is the HTML mechanism. However, browsers handle them differently, giving <link> a clear advantage in terms of performance. That is @import is used in CSS files to include / import the other existing CSS/stylesheet within another. While link is used to add reference to your CSS file in HTML,so that it can refer & load appropriate style..

Difference between @import and <link> is: - @import is used to include / add a CSS file into other CSS file. - <link> is used to link a CSS file to your web page.

If you have10 stylesheets, in your page you have to write10 times like this:<link href="css/screen.css" rel="stylesheet" type="text/css" />

 

But if you use @import option, you call only1 stylesheet and in the top of this stylesheet you call remaining9 stylesheets.