Scribd
Upload
4 views

CSS_PROPERTIES (1)

Cascading style sheet properties for lower grades

Uploaded by

BlueCherry Clouds
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
4 views

CSS_PROPERTIES (1)

Cascading style sheet properties for lower grades

Uploaded by

BlueCherry Clouds
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 6

Term: II

Session 2021-2022

CSS PROPERTIES

1. Background colour
The background-color property sets the background color of an element.
Eg:
background-color: coral;
background-color: #92a8d1;
background-color: rgb(201, 76, 76);
2. Color
The color property specifies the color of text.
Eg:
body {
color: red;
}

h1 {
color: #00ff00;
}

3. Alignment
The text-align property specifies the horizontal alignment of text in an element

Eg:

h1 {
text-align: center;
}

p{
text-align: right;
}

Tini Vasanth ICT-Yr. VIII ICT Term II (2021-2022)


Term: II
Session 2021-2022

p{
text-align: justify;
}
4. Font

The font property is a shorthand property for:

 font-style: used to specify italic text


 font-weight: specifies the weight of a font
 font-size/line-height: sets the size of the text.
 font-family: to specify the font of a text

Eg:

font-family: Times New Roman;


font-family: Arial;
font-family: Lucida Console;
font-style: normal;
font-style: italic;
font-style: oblique;
font-weight: normal;
font-weight: bold;
font-size: 40px;
font-size: 40pt;
font-size: 100%;
5. Border
The CSS border properties allow you to specify the style, width, and color of an element's
border.

 border-style: specifies what kind of border to display


 border-width: specifies the width of the four borders
 border-color: to set the color of the four borders.
 border-radius: to add rounded borders to an element
 border-collapse: sets whether table borders should collapse into a single border or be
separated.

Tini Vasanth ICT-Yr. VIII ICT Term II (2021-2022)


Term: II
Session 2021-2022

Eg:

border-style: dotted;
border-style: dashed;
border-style: solid;
border-style: double;

border-width: 5px;

border-width: medium;

border-width: thick;

border-color: red;

border-color: #ff0000;

border-radius: 5px;
border-collapse: separate;//default value
border-collapse: collapse;

6. Margin

The margin property sets the margins for an element, and is a shorthand property for the
following properties:

 margin-top
 margin-right
 margin-bottom
 margin-left

Eg:

margin-bottom: 25px;
margin-left: 30px;
margin-right: 150px;
margin-top: 25px;
margin: auto; // The browser calculates a margin

Tini Vasanth ICT-Yr. VIII ICT Term II (2021-2022)


Term: II
Session 2021-2022

Centre aligned within browser window:


margin-left: auto;
margin-right: auto;

7. Padding

An element's padding is the space between its content and its border.

The padding property is a shorthand property for:

 padding-top
 padding-right
 padding-bottom
 padding-left

Eg:
padding-bottom: 25px;
padding-right: 25px;
padding-left: 25px;
padding-top: 25px;

8. Width
The width property sets the width of an element.
Eg:
width: 50%;
width: 250px;
width: auto;// The browser calculates the width

9. Height
The height property sets the height of an element.
Eg:
height : 50%;
height : 250px;

Tini Vasanth ICT-Yr. VIII ICT Term II (2021-2022)


Term: II
Session 2021-2022

height : auto;// The browser calculates the height

10. Visibility
The visibility property specifies whether or not an element is visible.
Eg:
visibility : visible;//default value
visibility : hidden;
11. class
The class attribute is often used to point to a class name in a style sheet.

For more CSS properties refer below link


https://www.w3schools.com/css/default.asp

Tini Vasanth ICT-Yr. VIII ICT Term II (2021-2022)


Term: II
Session 2021-2022

Tini Vasanth ICT-Yr. VIII ICT Term II (2021-2022)

You might also like