How to add external CSS in a HTML file.

Question

I know about CSS like this

.style{ .. }

I want to know how to add external css file in a HMTL page. One more thing using such external css dose it relay speed up the page load time.

Answer 1

In your HEAD, add:

<link rel="stylesheet" type="text/css" href="your_css_file.css">

the css file itself does not contain <style> tags.

Answer 2

The simplest way to do so is to add a stylesheet link to your document HEAD section:

<link rel="stylesheet" href="style.css" type="text/css">

Doing so will reduce the performance on the first load (since the system must request two files instead of one) but improve subsequent performance because the style sheet remains in cache for a while.

Answer 3

From StackOverflow's page:

<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=5885"  type="text/css">

I don't think it will improve speed much unless the same CSS file is shared across multiple webpages in your website (so the browser can cache it). Otherwise there's the penalty of creating an extra HTTP connection to retrieve the CSS.