Scribd
Upload
5 views

CSS Properties Class X

The document lists various CSS properties along with their explanations and examples. It covers properties related to text styling, background settings, spacing, and borders. Each property is accompanied by a brief description and a sample code snippet demonstrating its usage.

Uploaded by

ayushiguptab0406
Copyright
© © All Rights Reserved
Available Formats
Download as XLSX, PDF, TXT or read online on Scribd
5 views

CSS Properties Class X

The document lists various CSS properties along with their explanations and examples. It covers properties related to text styling, background settings, spacing, and borders. Each property is accompanied by a brief description and a sample code snippet demonstrating its usage.

Uploaded by

ayushiguptab0406
Copyright
© © All Rights Reserved
Available Formats
Download as XLSX, PDF, TXT or read online on Scribd
You are on page 1/ 6

Lists various CSS properties

S.No CSS Property

color
1
2 font-family

3 font-size

font-weight
4

font-style
5

font-variant

text-align
7

text-decoration
8

text-transform

text-indent
10

letter-spacing
11

word-spacing
12

background-color
13
background-image
14

background-position
15

background-repeat
16

width
17

height
18

padding

19

padding-top

20

padding-right

21

padding-bottom

22

padding-left

23

margin
24

margin-top
25

margin-right
26
margin-bottom
27

margin-left
28

border

29

border-width
30

border-style
31
border-color
32

outline

33

float

34
Lists various CSS properties

Explanation Example

Sets the color of the text. color: red;

Specifies the font of the text. font-family: Arial, sans-serif;


Sets the size of the font. font-size: 16px;

Defines the thickness of the font


font-weight: bold;
characters.

Specifies the style of the font (normal,


font-style: italic;
italic, oblique).

Controls the use of alternate glyphs font-variant: small-caps;


(variants) for text in certain fonts, such The text will display in small
as small caps or alternate characters. caps.

Specifies the horizontal alignment of


text-align: center;
text.

Adds decoration to text like underline,


text-decoration: underline;
line-through, etc.

Controls the capitalization of text


text-transform: uppercase;
(uppercase, lowercase, capitalize).

Indents the first line of text in a


text-indent: 20px;
paragraph.

Adjusts the spacing between


letter-spacing: 2px;
characters.

Adjusts the spacing between words. word-spacing: 5px;

Sets the background color of an


background-color: lightblue;
element.
Specifies an image to be used as the background-image:
background. url('image.jpg');

Sets the position of the background


background-position: center;
image.

Specifies if/how the background image background-repeat: no-


is repeated. repeat;

Defines the width of an element. width: 100px;

Defines the height of an element. height: 200px;

Defines the space between the content


padding: 10px;
and the border of an element.

Defines the space between the content


padding-top: 20px;
and the top border of an element.

Defines the space between the content


padding-right: 15px;
and the right border of an element.

Defines the space between the content


padding-bottom: 10px;
and the bottom border of an element.

Defines the space between the content


padding-left: 5px;
and the left border of an element.

Defines the space outside the border of


margin: 20px;
an element.

Defines the space above an element. margin-top: 15px;

Defines the space to the right of an


margin-right: 10px;
element.
Defines the space below an element. margin-bottom: 20px;

Defines the space to the left of an


margin-left: 25px;
element.

Sets the width, style, and color of the


border: 1px solid black;
border around an element.

Defines the width of the border around


border-width: 2px;
an element.

Specifies the style of the border (solid,


border-style: dashed;
dotted, dashed, etc.).

Sets the color of the border. border-color: blue;

A shorthand property for setting the


outline-color, outline-style, and outline-
width in one declaration. It draws a line
around an element, outside the border,
without affecting layout. outline: 2px solid red;

Specifies whether an element should


float to the left or right of its container,
allowing content to wrap around it. The
element is taken out of the normal float: left;
document flow. float: right;

You might also like