Cara Mengatur Tampilan Mobile dengan CSS

Cara Mengatur Tampilan Mobile dengan CSS

Cara Mengatur Tampilan Mobile dengan CSS

iNDZGN - Pada kesempatan kali ini kita akan belajar bagaimana caranya Mengatur Tampilan Mobile dengan CSS. Untuk template default atau bawaan blogger mungkin ini tidak ada masalah.

Mungkin pertanyaan ini akan muncul bagi kamu yang sedang memodifikasi tampilan mobile atau merancang tampilan mobile pada template blogger kamu. jika kita membongkar dan mempelajari struktur kode yang diberikan oleh template bawaan blogger, maka kita akan mendapatkan fungsi expr:class='"loading" + data:blog.mobileClass' yang terletak pada tag pembuka body.

Ternyata fungsi tersebut berguna untuk mengatur tampilan blog versi mobile sesuai yang kita inginkan dengan menggunakan CSS. Untuk lebih jelasnya saya akan gambarkan contohnya sebagai berikut :
<body expr:class="&quot;loading&quot; + data:blog.mobileClass">
Kode HTML yang terdapat pada template kamu gunakan
</body> 

<style type="text/css">
/*Penggunaan fungsi '.mobile' pada CSS, agar kita dapat mengatur tampilan blog versi mobile pada area atau daerah body*/
.mobile body {bla... bla...}

/*ini untuk pengaturan tampilan blog versi desktop, tanpa perintah '.mobile'*/
body {bla... bla...}
</style>

Untuk lebih jelasnya, coba kamu buka blog indzgn ini pada dua versi yakni versi dekstop dan versi mobile. Jika diperhatikan lebih detail, maka akan terdapat perbedaan yang mencolok pada kedua versi tersebut.

Nah itu tadi sedikit pembelajaran mengenai Cara Mengatur Tampilan Mobile dengan CSS. Semoga bermanfaat untuk kamu. Terimakasih.
Load comments