Box Shadow types
Box Shadow types
<html>
<head>
<title>CSS BOX</title>
<style>
.a
{
background-color:black;
height:100px;
width:100px;
box-shadow:5px 5px 5px red;
}
.b
{
background-color:black;
height:100px;
width:100px;
box-shadow:1px 1px 1px red,
2px 2px 1px red,
3px 3px 1px red,
4px 4px 1px red,
5px 5px 1px red,
6px 6px 1px red,
7px 7px 1px red;
}
.c
{
background-color:black;
height:100px;
width:100px;
box-shadow:0px 0px 10px red;
}
.d
{
background-color:black;
height:100px;
width:100px;
box-shadow:inset 8px 8px 12px red;
}
.d
{
background-color:black;
height:100px;
width:100px;
box-shadow:inset 8px 8px 12px red;
}
</style>
</head>
<body>
<div class="a"></div>
<br>
<div class="b"></div>
<br>
<div class="c"></div>
<br>
<div class="d"></div>
</body>
<html>
<html>
<head>
<title>CSS BOX</title>
<style>
.a
{
background-color:black;
height:100px;
width:100px;
box-shadow:5px 5px 5px red;
}
.b
{
background-color:black;
height:100px;
width:100px;
box-shadow:1px 1px 1px red,
2px 2px 1px red,
3px 3px 1px red,
4px 4px 1px red,
5px 5px 1px red,
6px 6px 1px red,
7px 7px 1px red;
}
.c
{
background-color:black;
height:100px;
width:100px;
box-shadow:0px 0px 10px red;
}
.d
{
background-color:black;
height:100px;
width:100px;
box-shadow:inset 8px 8px 12px red;
}
.d
{
background-color:black;
height:100px;
width:100px;
box-shadow:inset 8px 8px 12px red;
}
</style>
</head>
<body>
<div class="a"></div>
<br>
<div class="b"></div>
<br>
<div class="c"></div>
<br>
<div class="d"></div>
</body>
<html>
Comments
Post a Comment