CSS Tutorial 4
Prepared by: Anthony Larrain
Document Level Styles
- Document level styles are styles that apply to a single HTML page.
- Place the styles between the tags
<style></style> - The
styletags are placed within the head section.
Example
External Styles
- The CSS style rules are placed in their own text file not, the HTML file.
- The text file should end with
.csssuffix. - The
<link>tag is used to link the styles with the HTML file. - The CSS styles can be used by any HTML file.
Example 1
Suppose we had a text file named style.css that contained the styles.
To use these styles we need to link this file to the HTML document.
Example
The HTML The External Style Sheet
Inline Styles
Add the style to the element's start tag using the HTML style attribute.
Example
Browser Display
This paragraph will be magenta
This paragraph will be whatever 3366FF represents.
- Very specific, the style applies for this one time.
- Avoid over using inline styles.