Hello sobat icloudZer kali ini admin bakalan memberikan informasi mengenai bagaimana caranya mengubah ukuran gambar melalui kode CSS diblogger
Info: Oke jika kamu sudah penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama
Gambar
Dalam tampilan website hal terpenting yang harus diperhatikan adalah tampilan Gambar, yang mana gambar merupakan suatu unsur penting sebagai perwakilan penyampaian informasi serta sebagai penghias tampilan blog agar semakin menarik tentunya
Ukuran Gambar
Terkhusus didalam dunia blogger sendiri, gambar bisa ditampilkan sesuai keinginan kita, semisal menampilkan gambar pada header blog sebagai logo, ataupun juga menampilkan gambar sebagai thumbnail artikel didalam blog, dan pastinya setiap gambar yang ditampilkan akan memiliki ukuran yang berbeda beda sesuai fungsi dan kegunaan seperti yang sudah saya jelaskan sebelumnya
Cara mengubah ukuran
Sedangkan jika ingin mengubah ukuran gambar kita bisa menggunakan kode CSS dan juga kode HTML, namun kali ini terkhusus nya admin bakalan memberikan informasi mengenai cara mengubah ukuran gambar menggunakan kode CSS dan mungkin dilain kesempatan admin bakalan memberikan penjelasan mengenai cara mengubah gambar melalui kode HTML
Kode CSS
Baiklah saatnya admin bakalan memberikan penjabaran mengenai cara menggunakan kode CSS untuk mengubah gambar sesuai keinginan kita
Contoh kode
Semisal class CSS yang digunakan untuk mengubah ukurannya adalah .ubahukuran kemudian tambahkan tag class img pada class .ubahukuran dan gunakan item ataupun properti width dan height untuk menentukan ukuran yang diinginkan
Kode Lengkap
Jika masih bingung dengan penjelasan diatas kamu bisa melihat contoh kode lengkapnya seperti contoh kode dibawah ini
.ubahukuran{
display:block;
}
.ubahukuran img{
width:28px;
height:28px;
}
Info: Kamu bisa menyalin dan menggunakan kode CSS diatas
Cara Menampilkan
Cara menampilkan gambar dan menjalankan fungsinya kita harus menggunakan kode HTML
Kode Lengkap
Nah kode HTML yang bisa kamu gunakan untuk menampilkan gambar dengan ukuran yang telah disesuaikan melalui kode CSS sebelumnya seperti contoh kode dibawah ini
<div class='ubahukuran'>
<img alt='Judul Gambar' src='link_gambar'/>
</div>
Info: Fungsi dari kode HTML diatas adalah untuk menampilkan gambar tersebut