Prak 10 - Ads Banner [2]

1. Tujuan
Belajar membuat Ads Banner berbasis HTML5.

2. Alat dan Bahan
JSFiddle
spritesheet.png
spritesheet.css

3. Dasar Teori

CSS Linear Gradient

Teknik Horizontal Centering

salah satu teknik horizontal centering untuk image adalah dengan menggunakan property text-align: center;. property ini bisa digunakan pada elemen HTML yang memiliki property display: block. sebagai ilustrasi, perhatikan kode berikut. kode tersebut mensimulasikan sebuah skenario dimana terdapat container dari sebuah gambar yang memiliki ukuran lebih besar dari gambar tersebut.

4. Tugas
Mengaplikasikan CSS Linear Gradient
Menambahkan sprite berikutnya
Me-resize sprite menggunakan CSS

5. Hasil
Mengaplikasikan CSS Linear Gradient


Menambahkan Sprite Berikutnya


Mere-size sprite menggunakan CSS


6. Referensi 
www.mohhasbias.com
http://mohhasbias.github.io/blog/2014/06/07/absolute-center-using-css/
Creating an HTML5 Banner Ad with GreenSock (GSAP)