Styling HTML with CSS
CSS stands for Cascading Style Sheets. CSS defines how HTML elements will show on display, paper, or in other media. CSS saves a lot of work. It can control the design of numerous websites simultaneously.
CSS can be added to HTML elements in 3 ways:
- Inline – by using the style attribute in HTML elements
- Internal – by using a “style” element in the “head” section
- External – by using an external CSS file
Connecting CSS in HTML via Inline Way
in HTML an inline CSS is used to apply a unique style to a single HTML element.
Connecting CSS in HTML via Internal Way
In HTML an internal CSS is used to define a style for one HTML page. We use this CSS in the “style” tag and in the “head” section of the HTML document.
Connecting CSS in HTML via External Way
An external style sheet is used to define the style for many HTML pages. With an external style sheet, you can change the look of an entire website, by changing it into one CSS file. You can connect your CSS file in html with the “link” tag in the head section. but you have to save your CSS in different CSS files with exertion .css for example “style.css”. All you have to do is make two files 1st is for HTML (home.html) and 2nd is for CSS (style.css) and connect the “style.css” with “home.html” by link tag. See the example below.
CSS Text Color Changing
The CSS color property defines the text color to be used.
CSS Font Size
The CSS font-size property defines the text size to be used.
CSS Background Color
The CSS “background-color” property defines the color of the background of any element like the body of the html document, html box, or text.
Connecting CSS Task 1 – Text Color
Connecting CSS Task 2 – Font Size
Connecting CSS Task 3 – Font Size
Connecting CSS Task 4 – Background color
