let's create a web page named boxshadow.html which is used to display the implementation of box-shadow property.
<!doctype html>
<body>
<h1 style="border:10px solid;-webkit-box-shadow:20px 20px 20px #888";>
First heading element
</h1><br><br>
<h1 style="border:10px solid;-webkit-box-shadow:inset 20px 20px 20px #888">
Second heading element.
</h1><br><br>
<h1 style="border:10px solid;-webkit-box-shadow:-20px 20px 20px #888">
Third heading element
</h1>
</body>
</html>
The box-shadow property is applied to the h1 element with different values.
The output of above Web page:
<!doctype html>
<body>
<h1 style="border:10px solid;-webkit-box-shadow:20px 20px 20px #888";>
First heading element
</h1><br><br>
<h1 style="border:10px solid;-webkit-box-shadow:inset 20px 20px 20px #888">
Second heading element.
</h1><br><br>
<h1 style="border:10px solid;-webkit-box-shadow:-20px 20px 20px #888">
Third heading element
</h1>
</body>
</html>
The box-shadow property is applied to the h1 element with different values.
The output of above Web page:
No comments:
Post a Comment