@coder 1105
CSS3 BOX-SHADOW
2021-11-16 22:55 · 2 min read
Box-Shadow is a CSS property that is used to give shadow effects to HTML elements. We can use multiple CSS box-shadow properties to give an attractive 3D look to HTML elements.
How to use the box-shadow property?
We can attach one or more shadow with HTML elements. A CSS3 box-shadow property used X and Y offset relative to HTML element
- SYNTAX
box-shadow: [horizontal offset] [vertical offset] [blur radius] [optional spread radius] [color];
<style>
/*example*/
.tdb-shadow{
width:50px;
height:50px;
box-shadow:5px 0 0 5px gray;
}
</style><head>
<style>
.tdb-shadow{
padding:15px 0;
text-align:center;
width:150px;
border-radius:5px;
box-shadow:2px 2px 5px 0px gray;
}
</style>
</head>
<body>
<div class="tdb-shadow">Box-Shadow</div>
</body>
TAGS:
POPULAR POSTS
best free web hosting services...
what is new in miui 11?...
free website ssl security using cloudfla...
do you want to make money online?...
CSS3 @IMPORT RULES...
What is HTML Anchor Tag and Hyperlinks?...
CSS3 RESPONSIVE UI...
How to host a web page in 10 minutes....
Tables HTML...
CSS3 FUNCTIONS...
How to use CSS3 Overflow Property?...
CSS3 FILTERS...
RECENT COMMENTS
2022-03-05 11:05
By coder
on XAMPP - MySQL shutdown unexpectedly | How to fix MySQL crash unexpectedly
2021-10-12 12:34
By abnongoke
on do you want to make money online?
2021-10-12 12:34
By abnongoke
on how to get a free website domain name?
2021-10-12 12:34
By solar panel for shed
on what is new in miui 11?
2021-10-12 12:34
By solar panel for shed
on best free web hosting services
2021-10-12 12:34
By amos tanui
on free website ssl security using cloudflare
