Cara Memperbesar Ukuran Gambar Di Html

Daftar Isi:

Cara Memperbesar Ukuran Gambar Di Html
Cara Memperbesar Ukuran Gambar Di Html

Video: Cara Memperbesar Ukuran Gambar Di Html

Video: Cara Memperbesar Ukuran Gambar Di Html
Video: #4.2 Belajar HTML cara mengubah ukuran gambar / image untuk pemula 2024, Mungkin
Anonim

Anda dapat mengubah ukuran gambar yang ditampilkan pada halaman dengan menentukan atribut yang sesuai untuk tag

yang bertanggung jawab untuk menampilkan grafik pada halaman HTML. Menambah atau mengurangi dilakukan melalui atribut lebar dan tinggi.

Cara memperbesar ukuran gambar di html
Cara memperbesar ukuran gambar di html

Sisipkan gambar

Sebelum mengedit, tambahkan gambar ke halaman dengan menentukan tag

… Untuk mengedit dokumen HTML, Anda perlu membuka halaman di editor teks apa pun. Klik kanan pada file dan pilih atribut "Buka Dengan" - "Notepad". Anda juga dapat menentukan editor lain yang lebih nyaman untuk Anda gunakan untuk mengubah kode.

Buka bagian dokumen dan temukan tag

… Jika gambar belum ditambahkan ke halaman, masukkan kode berikut:

Jalur ke file gambar dapat berupa relatif atau absolut. Atribut alt="Image" bertanggung jawab atas nama gambar dan menambahkan keterangan untuk itu, yang akan ditampilkan ketika penunjuk mouse di atas gambar.

Perubahan ukuran

Untuk memperbesar gambar, atur parameter lebar dan tinggi yang sesuai dengannya dengan menambahkan atribut ke tag gambar:

Parameter lebar sesuai dengan lebar gambar, dan tinggi berisi indikator tinggi gambar. Dalam hal ini, ketika halaman dibuka, gambar dengan lebar 300 piksel dan tinggi 350 piksel akan ditampilkan di jendela browser. Anda juga dapat menambahkan atribut hspace dan vspace untuk mengubah pengaturan pemformatan pada halaman:

Dalam deskriptor ini, margin horizontal (hspace) dan vertikal (vspace) dari gambar ditentukan. Teks apa pun yang ditambahkan ke halaman akan diberi jarak 5 piksel secara horizontal dari gambar dan 10 piksel secara vertikal. Atribut perbatasan bertanggung jawab untuk membuat batas 1 piksel di sekitar gambar.

Perlu dicatat bahwa ukuran gambar dapat diatur tidak hanya dalam piksel, tetapi juga sebagai persentase relatif terhadap ukuran jendela browser. Sebagai contoh:

Sebagai hasil dari pekerjaan kode ini, gambar akan direntangkan di seluruh lebar jendela. Perlu dicatat bahwa gambar dalam kasus ini mungkin terdistorsi. Tampilan gambar yang diperbesar tergantung pada kualitas gambar itu sendiri.

Simpan perubahan yang dibuat menggunakan fungsi "File" - "Save" dari jendela "Notepad". Periksa tampilan gambar di jendela browser dengan membuka file HTML dengan mengklik kanan dan memilih opsi "Buka Dengan". Dalam daftar opsi yang diusulkan, pilih program yang Anda gunakan untuk menjelajah Internet. Anda dapat mengedit file HTML beberapa kali untuk menyesuaikan ukuran gambar.

Direkomendasikan: