Cara Membuat Header Responsive FullScreen di Blog - Header ,..? apaan itu header , header dalam indonesia adalah kepala sedangkan jika kita terapkan dalam dunia website atau blogger , header ialah bgian paling atas suatu blog atau yang biasa disebut header ( kepala ) . kali ini kita akan membahas tentang bagaimana Membuat Header Yang Responsive FullScreen di Blog . dengan demikian nanti header blog anda akan menjadi layar penuh dan bisa menyesesuaikan dengan layar .
DEMONYA SEPERTI HEADER DI ATAS
1. Pertama Masuk dulu ke blogger sobat
2. Pilih Menu => Edit HTML
3. Cari kode ]]</b:skin> atau </style>
4. Setelah itu Letakkan CSS berikut tepat di atas ]]</b:skin>
/* Header */ #header-wrapper{width:100%;overflow:hidden;background: rgba(252, 252, 252, 0.74);padding:10px 0; border-bottom: 1px solid #eee;} #header-kiri{float:left;max-width:40%;overflow:hidden;} #header-kanan{float:right;max-width:60%;overflow:hidden;} #header-kanan img{max-width:100%;} .header .widget{padding:5px;} .description { margin: 0px; font-size:13px; } .title { font-size: 22px; margin: 0px; }.pembatas{max-width:960px;margin:0 auto;}
5. Langkah selanjutnya Letakkan HTML berikut tepat di bawah <body>
<header id='header-wrapper'> <div class='pembatas'> <b:section class='header' id='header-kiri' maxwidgets='1'><b:widget id='Header1' locked='true' title='(Header)' type='Header'></b:widget> <b:section class='header' id='header-kanan' maxwidgets='1'/> </div> </header>
*Keterangan : ubah angka 960px; dan sesuaikan dengan lebar template sobat ( outer-wrapper )
6. Done ( Taraaa akhirnya selesai deh , sekarang sobat sudah bisa Membuat Header Responsive FullScreen di Blog dengan baik dan perfect hehehehehh )
Nah itulah trick dan tips Cara Membuat Header Responsive FullScreen di Blog atau dengan kata lain membuat header kepala blogger menjadi layar penuh sesuai dengan layar . demikian artikel saya kali ini tentang Cara Membuat Header Responsive FullScreen di Blog semoga bermanfaat bagi anda .
0 comments:
Posting Komentar