-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathboxModel.html
More file actions
55 lines (52 loc) · 1.51 KB
/
Copy pathboxModel.html
File metadata and controls
55 lines (52 loc) · 1.51 KB
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
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BoxModel</title>
<style>
div.classOne{
width: 300px;
background-color: yellowgreen;
margin: 10px;
text-align: center;
}
div.classTwo{
width: 300px;
margin: 5px;
border: 5px solid black;
padding: 5px;
background-color: #dddddd;
box-sizing:border-box;
letter-spacing: 1px;
outline: 3px groove lightsalmon;
outline-offset:0px;
text-align: left;
vertical-align: middle;
text-decoration: ;
text-decoration: solid;
box-shadow: 5px 5px 30px blue;
}
#p1.upperCase{
text-transform: capitalize;
font-size: 100%;
text-indent: 50px;
line-height: 20px;
word-spacing: 10px;
}
#heading{
font-variant: small-caps;
font-size: 43px;
text-shadow: 3px 3px 3px white;
}
</style>
</head>
<body>
<div class="classOne">
<h1 >Heading One</h1>
</div>
<div class="classTwo">
<h1 id="heading" >Heading Two</h1>
<p id="p1" class="upperCase">box Model says width is the combinition of four things, margin, padding, border, width. box Model says width is the combinition of four things, margin, padding, border, width. box Model says width is the combinition of four things, margin, padding, border, width. box Model says width is the combinition of four things, margin, padding, border, width</p>
</div>
</body>
</html>