Membuat Clipping Mask di HTML5 dan CSS3

Hallo Dumenity pecinta desain grafis ketemu lagi di blog DUMET School. Kali ini Saya ingin memberikan tutorial tentang Clipping Mask di HTML5 dan CSS3, pasti bagi pecinta desain grafis tidak asing lagi dengan yang namanya Clipping Mask, semua Designer pasti tau cara membuat Clipping Mask di Photoshop atau di software desain lainnya. Nah ada yang tau bagaimana membuat Clipping Mask di HTML5 dan CSS3?, di sini saya akan share caranya. Ikuti langkah - langkah berikut ini:

1. Silahkan buka Software yang biasa kalian gunakan untuk membuat HTML5 dan CSS3, di sini saya akan menggunakan Software Adobe Dreamweaver CS6.
2. Buatlah file HTML baru dengan mengkilik menu File > New > kita pilih Page Type = HTML dan DocType = HTML5

3. Kita buat Tag HTML <h1>DUMET School</h1>

4. Kita buat CSS seperti gambar di bawah ini

5. Jika sudah Save dan preview di browser, lihat hasilnya Clipping Mask sudah jadi.

Mudah bukan, Silahkan mencoba