Programer
Programer

Reputation: 401

Adding external CSS in an HTML file

I know I can include CSS on my page like this:

<style>
.style{
   .. 
}
</style>

How do I add an external stylesheet file in an HTML page?

Upvotes: 39

Views: 96936

Answers (4)

kta
kta

Reputation: 20150

The syntax of adding external CSS to an HTML file is

<link rel="stylesheet" href="style.css">

But it will be easy to remember and more consistent if I could do it as

<style rel='stylesheet' href="/style.css"></style>

Upvotes: 0

Victor Nicollet
Victor Nicollet

Reputation: 24587

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.

Upvotes: 21

rui
rui

Reputation: 11284

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.

Upvotes: 3

Pekka
Pekka

Reputation: 449793

In your HEAD, add:

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

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

Upvotes: 68

Related Questions