Loading lesson path
Concept visual
Start from A
When a browser reads a style sheet, it will format the HTML document according to the information in the style sheet. There are three ways of inserting a style sheet:
Formula
External CSS - link to an external .css file
Internal CSS - use the < style > element in the head section
Inline CSS - use the style attribute on HTML elementsWith an external style sheet, you can change the look of an entire website by changing just one file! Each HTML page must include a reference to the external style sheet file inside the <link> element, inside the head section.
Formula
External styles are defined within the < link > element, inside the < head > section of an HTML page:<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="mystyle.css"> </head> <body>
Formula
< h1 > This is a heading </h1 >
< p > This is a paragraph.</p ></body> </html> An external style sheet can be written in any text editor, and must be saved with a .css extension. The external .css file should not contain any HTML tags. Here is how the "mystyle.css" file looks: "mystyle.css"
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}Do not add a space between the property value (20) and the unit (px):
margin-left: 20 px;margin-left: 20px;