Membuat Desain Responsive Sederhana Pada Tampilan Content

Hallo teman-teman apa kabar semuanya semoga sehat semuanya ya teman-teman, amin.. Pada tutorial kali ini saya akan melanjutkan tutorial yang sebelumnya yang pernah saya posting di blog DUMET School yaitu tentang bagaimana caranya membuat Desain sederhana Navigasi Menu Responsive dan pada tutorial kali ini saya akan mengajarkan kepada teman-teman bagaimana caranya membuat Desain Responsive Sederhana pada Tampilan isi Content hanya menggunakan CSS. Baiklah kita langsung saja masuk ke pokok pembahasannya.

Pertama teman-teman bisa buat struktur file HTML nya seperti di bawah ini :

Setelah teman-teman buat file HTML nya teman-teman bisa buat file CSS nya untuk tampilan di layar dekstop seperti di bawah ini :

Lalu di bawah ini adalah CSS untuk tampilan Responsive untuk di layar dengan ukuran kecil :

Setelah semua Source kodenya teman-teman tulis dengan benar teman-teman bisa save dan lihat hasil nya. Mudah kan teman-teman hanya dengan CSS kita sudah dapat menghasilkan desain Responsive yang kita inginkan.

Sekian dulu Tutorial dari saya semoga bisa menambah ilmu teman-teman. Terima Kasih.

Kalau teman-teman ingin melihat hasilnya di SINI dan DOWNLOAD Source.