<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
*{padding: 0px
;margin: 0px
;}
.box1
{
width: 50px
;
height: 50px
;
padding: 25px
;
background-color: red
;
}
.box2
{
width: 96px
;
height: 96px
;
border: 2px solid red
;
}
.box3
{
width: 100px
;
height: 100px
;
background-color: yellow
;
}
.box4
{
width: 100px
;
height: 100px
;
margin: 50px
;
background-color: red
;
}
.box5
{
width: 150px
;
height: 150px
;
border: 25px solid red
;
}
.box6
{
width: 150px
;
height: 150px
;
padding: 20px
;
border: 20px solid blue
;
background: red
;
}
.box7
{
width: 300px
;
height: 300px
;
background-color: purple
;
}
.box8
{
width: 100px
;
height: 100px
;
padding: 25px
;
border: 25px solid #000
;
margin: 50px
;
}
.box9
{
width: 150px
;
height: 150px
;
padding: 25px
;
background-color: red
;
}
.box10{
width: 160px
;
height: 160px
;
border: 20px solid #000
;
background-color: deepskyblue
;
}
</style>
</head>
<body>
<div class=
"box1">box1</div><br>
<div class=
"box2">box2</div><br>
<div class=
"box3">box3</div><br>
<div class=
"box4">box4</div><br>
<div class=
"box5">box5</div><br>
<div class=
"box6">box6</div><br>
<div class=
"box7">box7</div><br>
<div class=
"box8">box8</div><br>
<div class=
"box9">box9</div><br>
<div class=
"box10">box10</div>
</body>
</html>
