SANTOSH DAHAL

# Learn CSS

# Before and After Css

# CSS Comands

# Margin:

The CSS margin properties are used to create space around elements, outside of any defined borders.

# Padding:

The CSS padding properties are used to generate space around an element's content, inside of any defined borders.

# Text- align:

The text-align property specifies the horizontal alignment of text in an element.Aligns in center or right or left. Eg:text-align: center;

# Background-color:

The background-color property sets the background color of an element.

# Color:

Gives colour to the text.

# Border-radius:

The border-radius property defines the radius of the element's corners.

# Width, Height:

sets the width and height of the picture or webpages or anything else.

# Letter-spacing

The letter-spacing property increases or decreases the space between characters in a text.

# Font-size

The font-size property sets the size of a font.

# Font-weight

The font-weight property sets how thick or thin characters in text should be displayed.

# Display

The display property specifies the display behavior (the type of rendering box) of an element.

<doctype html>
<head>
<meta charset="utf-8">
<title>wrc webpage</title>
</head>
<body>

<div class="mar">
    <p><b>Margin</b> of 30px <i>[Note:All sides.]</i> and <b></b>Text align</b> : left</p>
</div>

<div class="pad">
    <p><b>padding</b> of 30px[<i>Note::Left and Right]</i> and <b>Text align</b> : center</p>
</div>

<div class="border">
    <p>Border=1px;<br />  <b>Border radius</b>:30%<i>[Note: radius more than 50% will be ellipse or circle like shape]</i><br />
        Width: 50px <br />Height:70px;
    </p>
</div>

<div class="space">
<p><b>color of text</b>: pink, <b>letter spacing</b>: 5px </p>
</div>

<div class="weight">
        <p><b>font-size</b>: 33px; <b>font-weight</b>:900</p>
        </div>

<p>

</body>
<style type="text/css">
.mar{
    margin:30px;
    background:lightgreen;
    text-align:left;}

.pad{
    padding:30px;
    background:lightblue;
    text-align:center;
}
.space{
    color:rgb(199, 36, 63);
    letter-spacing:5px;

}
.weight{
    font-size:33px;
    font-weight:900;
}

.border{
    border:1px;
    border-radius: 30%;
    width:150px;
    height:170px;
    background:rgb(231, 243, 12);
}

</style>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63

← Build Free Website →