» »Unlabelled » Pembuatan Halaman Web Reponsive

Pembuatan Halaman Web Reponsive

Posted by Unknown Labels: at 3:34 PM

Pembuatan Halaman Web Reponsive

Kali ini saya akan belajar tentang halaman web yang reponsive. Tetapi saya untuk membuat templatesnya tidak coding manual melainkan download di "Download templates reponsive".

1. Saya akan memilih template yang akan didownload dan sesuai selera.
2. Saya akan meng-extract filenya tersebut. Tampilan awal yang saya download seperti dibawah ini:
Disini file CSS dan HTMLnya tidak gabung. Pertama kali saya ingin mengganti background dan gambar pada slidenya.
Untuk mengganti gambar backgroundnya kita cari file business-casual.css. Di file cssnya kita bisa ganti ukuran, warna, dan yang lain-lain yang menyangkut dengan web.

Nah ini contoh text editor yang saya ganti:
Setelah backgroundnya saya edit, dan dibawah ini adalah hasilnya:


Setelah itu saya akan mengganti tulisan diatas navbar dan menambahkan gambar pada slide bar.
Untuk mengganti tulisan diatas nav, scriptnya terletak di index.html:
Untuk mengganti dan menambah gambar slide, scriptnya seperti dibawah ini:
Setelah saya mengedit scriptnya, dibawah ini adalah hasilnya:
1. Halaman Home

2. Halaman Sport Voli
3.Halaman Sport Bulu Tangkis

Ini tampilan webnya jika diperkecil:
Ini tampilan di web browser dengan tampilan penuh:







Post a Comment

Back to Top