terbaru

Cara Membuat Header Blog Full Screen Total

: Minggu, Januari 29, 2017

Cara Membuat Header Blog Full Screen Total


Pengertian header blog full screen total adalah, elemen header blog memenuhi layar screen secara menyeluruh. Tidak hanya secara horizontal tapi juga secara vertikal. Contohnya seperti gambar sebelah kanan diatas. Yang tersisa, hanya elemen navigasi atas dan sedikit tampilan footer atau main di bagian bawah.


Bagaimana cara membuatnya?


Sebenarnya ini kelanjutan dari post sebelumnya, yaitu Cara Menjadikan Lebar Header Blog Full Screen. Bedanya, disitu yang full hanya lebar atau panjang header secara horizontal. Tapi sekarang, juga full secara vertikal dari atas ke bawah, sehingga tampilan header blog anda menjadi memenuhi bidang screen monitor secara total. Maka untk mencapai tampilan yang demikian, anda hanya perlu menambahkan tinggi elemen header. Jika sebelumnya tinggi header misalnya hanya berkisar pada 90px hingga 150px, maka sekarang tariklah hingga menjadi lebih tinggi lagi, sehingga luasnya jadi memenuhi tinggi screen monitor. Misalnya anda buat menjadi 500px dan seterusnya. Tapi tentu saja anda harus demo berkali-kali sampai anda menemukan tinggi yang paling pas. Sebagai patokan umum, rata-rata screen monitor ukuran standarnya adalah 1366 x 766 px. Berarti angka 766px, bisa menjadi acuan sebagai tinggi maksimal. Cara penulisannya, juga sama dengan CSS untuk lebar header, contohnya seperti ini:


height: 500px


Lalu bagaimana jika layar screen pengunjung yang tingginya lebih kecil dari tinggi header blog anda? Tentu saja resikonya tampilan elemen header blog anda bagi mereka akan menjadi terpotong. Maka disinilah pentingnya peranan template responsif. Termasuk tampilan header yang responsif. Pelajari: Cara Sapujagat Menjadikan Blog Responsif.

Komentar yang tidak relevan, jorok, spamming dan promosi link akan dihapus

Copyrights @ blogernas ■ Desember 2015 - Erianto Anas | Powered by Blogger