A. Alat dan Bahan
  1. Text Editor.
  2. Web Browser.

B. Pembahasan
Shadow di CSS3 adalah efek bayangan pada element maupun text.
Seperti biasa, pertama buatalah file baru index.html kemudian isikan text berikut.

<!DOCTYPE html>
<html>
<head>

<title>Belajar CSS3 | Box Shadow dan Text Shadow</title>
<style type="text/css">
#box {
width: 200px;
height: 200px;
background-color: blue;
box-shadow: 2px 2px 8px grey;
}
h1 {
text-shadow: 2px 2px 8px red ;
}
</style>

</head>
<body>

<div id="box"> ini adlaah div dengan box shadow</div>
<h1> Ini text yang dengan efek shadow</h1>

</body>
</html>

Hasilnya :

Penjelasan :
pada kode css, box-shadow: 2px 2px 8px grey;
2px pertama adalah tebal efek bayangan vertika / x.
2px kedua adalah tebal efek bayangan horizontal / y.
8px adalah efek blur pada bayangan tersebut.
grey adalah warana bayanagan.

C. Refrensi

TAGS :