Page 85 - Computer - 7

7 7 Adding CSS in HTML5
Adding CSS in HTML5

Pre-Processing

• Understanding Cascading Style Sheets • Ways of Inserting CSS in HTML
• Setting Background Properties • Setting Text Properties
• Setting Margin Properties • Setting Border Properties
• Inline Styles

You have learned to create the basic design of a web page using HTML5 and view it in a web browser.
Let us now learn to use Cascading Style Sheets or CSS, in an HTML document to apply formatting to
various elements on a web page.

UNDERSTANDING CASCADING STYLE SHEETS

Cascading Style Sheets (CSS) is a style sheet language used to describe
the presentation of an HTML document. A style sheet holds formatting
codes that control the appearance of your web page. You can use style
sheets to enhance the look of various element, such as the background
colour, font, margins, alignment of text, and much more. CSS helps you
control the style and layout of multiple web pages at once.

Style Sheet Syntax

Style sheets are made up of rules. Each rule within CSS has two components: a selector and a declaration.
Selector : The selector specifies the element to which you want to apply a style rule and is followed by
a space.

Declaration : The declaration specifies the formatting rules for the selector. It consists of a property and
its value, separated by a colon (:). Multiple properties and their values can be specified, separated by
semicolons (;). The declaration is enclosed within a pair of braces { }.

selector {property1: value; property2: value; ...}

Declaration
For example, to set the background of a web page as yellow, the CSS statement is :
body {background-color: yellow}

Here, body is the selector, background-color is the property, and yellow is the value of the property.

83