HTML Tutorial
HTML Forms
HTML Graphics
HTML Media
HTML API
HTML CSS
CSS full form is Cascading Style Sheets.
CSS is used to control the layout of multiple web pages all at once.
What is CSS?
Cascading Style Sheets (CSS) gives format the layout of a webpage.
CSS provides controls for the color, font, size of text, the spacing between elements, how elements are positioned and laid out, what background images or background colors are to be used, and different displays for different devices and screen sizes.
Using CSS?
Using CSS
You can add CSS to HTML documents in three ways:
- Inline – When the style attribute is used inside HTML elements
- Internal – <style> element is used in the <head> section
- External – <link> element is used to link to an external CSS file
Inline CSS
An inline CSS gives a unique style to a single HTML element and uses the style attribute of an HTML element.
The following example sets the text color of the <h1> element to blue, and the text color of the <p> element to red:
Example
A Blue Heading
A red paragraph.
Internal CSS
An internal CSS defines a style for a single HTML page and is declared in thesection of an HTML page, within a
This is a heading
This is a paragraph.
External CSS
An external style sheet defines the style for many HTML pages and is added as a link in thesection of each HTML page
Example:
This is a heading
This is a paragraph.
Style.css
body {
background-color: powderblue;
}
h1 {
color: blue;
}
p {
color: red;
}
Output:
A Blue Heading
A red paragraph.
CSS Color, font and size
- The CSS color property is used to define the text color to be used.
- The CSS font-family property is used to define the font to be used.
- The CSS font-size property is used to define the text size to be used.
Example:
This is a heading
This is a paragraph.
Output:
This is Heading
This is a paragraph
CSS Border
The CSS border property describes a border around an HTML element.
This is a paragraph.
This is a paragraph.
This is a paragraph.
Output:
This is a paragraph
This is a paragraph
This is a paragraph
CSS Padding
The CSS padding property is used for padding (space) between the text and the border.
This is a paragraph.
Output:
This is a paragraph
CSS Margin
The CSS margin property is used to define the margin (space) outside the border.
This is a paragraph.
This is a paragraph.
Output:
This is a paragraph
This is a paragraph