---Inline, internal, and external CSS---

---External CSS---

- uses a seperate CSS file

- always referenced in the

- uses the and two attributes, rel and href

example: <link rel='stylesheet' href='style.css'>

example: <link rel='stylesheet' type='text/css' href='style.css'>

('type' is not required)


---Internal CSS---

inline css takes presedence over external

<head>

 <title>Page Title</title>

  <style>

   p {color: blue; }

  </style>

</head>

can use <style> tag included in the <head> element

example: <p style"color:blue;">This text is blue</p>


---Type, class, and id selectors----

+ type selectors - type selectors match the HTML by using the element name

+ class and ID attributes - used to attach extra info to HTML elements

+ class value is defined by you

+ same class can be used multiple times per page

+ ID's can only be used once per page

+ ID are selected using #


Type Selector

h1 { color: blue; }


ID Selector

<tag attribute='value'></tag>

<p class='example'></p>

<div id='example'></div>


Two Classes

<div class='style name'>

.style { color: blue; }

.name { font-size: 16px; }