Difference between – Alohci Jul 29 '13 at 23:17

Question

Method 1 (using <style type="text/css">)

Is simple way to declare CSS. But it should be used for small codes. When you want to overwrite an attribute of the main stylesheet.

Method 2 (using <link rel="stylesheet" href="path/to/style.css" />)

The first advantage of this method is that, we have a style in an external file. And that means that we can use it repeatedly. But this is not the end of the advantages. You can tell your browser to save the file in the cache. Which reduces page load time.

What is better?

In my opinion Method 2.

score 3 · Answer 1 · answered Jul 29 '13 at 23:03

Method 1 (using <style type="text/css">)

Is simple way to declare CSS. But it should be used for small codes. When you want to overwrite an attribute of the main stylesheet.

Method 2 (using <link rel="stylesheet" href="path/to/style.css" />)

The first advantage of this method is that, we have a style in an external file. And that means that we can use it repeatedly. But this is not the end of the advantages. You can tell your browser to save the file in the cache. Which reduces page load time.

What is better?

In my opinion Method 2.

score 2 · Answer 2 · answered Jul 29 '13 at 22:42

2

Using <style type="text/css"> is for CSS code in your HTML file and <link...> is for including an external CSS file.

answered Jul 29 '13 at 22:42

Thanks you very much, now I got it – Tarek Yacoub Jul 29 '13 at 22:44

score 1 · Answer 3 · answered Jul 29 '13 at 22:33

1

The first case <style type="text/css"> is for including css definitions in your html file. The 2nd case puts the css definintions in style.css (or whatever file is the href). The 2nd case makes it easy to use the same css across multiple html files.

answered Jul 29 '13 at 22:33

Barbara Laird

11,842
2
43
56

In that case shall I just have one of them written instead of both since they fetch the same way? – Tarek Yacoub Jul 29 '13 at 22:42
Using the external style sheet (your 2nd case) is preferred. In general it keeps your code better organized. If I have a class or 2 that is specific to one page, I'll use the 1st option (in additon to the external style sheet that has my site's shared css) to define those styles. If I have more than that, I'll create a new external style sheet for that page. It just all depends on how you want to organize your code. – Barbara Laird Jul 30 '13 at 15:39

score 0 · Answer 4 · answered Jul 29 '13 at 22:32

0

The first is used to insert css code directly in your html files, while the second is calling an external css file.

answered Jul 29 '13 at 22:32

heytools

726
3
16