Dengan menggunakan fasilitas text-shadow kita dapat membuat efek letterpress atau cetakan huruf dengan menggunakan CSS3.
Sebagai contoh perhatikan coding berikut ini:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html>
<head>
<title>Letter Press</title>
<style type=”text/css”>
h1
{
background-color: #a25252;
font-family: ‘Arial Bold’;
font-size: 75px;
color: #333;
text-shadow: 0px 1px 0 #777, 0 -1px 0 #000;
}
</style>
</head>
<body>
<h1>Letterpress</h1>
</body>
</html>
Hasil coding dapat dilihat di http://aris.proweb.asia/letterpress.html dengan tampilan seperti gambar berikut ini:
Kunjungi www.proweb.co.id untuk menambah wawasan anda.
Membuat efek letterpress dengan CSS3