Dalam bahasa markup hypertext (HTML), perintah khusus "tag" digunakan untuk menampilkan gambar pada halaman. Tag ini disebut sebagai img dan berisi sekumpulan variabel - "atribut". Dengan bantuan atribut, Anda dapat menentukan semua aspek tampilan gambar di halaman hypertext, termasuk dimensinya. Namun, ini bukan satu-satunya cara untuk memecahkan masalah - Anda juga dapat mengurangi ukuran gambar menggunakan Cascading Style Sheets (CSS).
instruksi
Langkah 1
Tempatkan atribut tinggi dan lebar di tag yang bertanggung jawab untuk menampilkan gambar yang diinginkan. Atur yang pertama ke ukuran vertikal gambar, dan yang kedua secara horizontal. Tetapkan kedua angka dalam piksel, tetapi tidak perlu menunjukkan unit - px - di sini. Saat menghitung nilai yang diperlukan untuk atribut ini, perhatikan kepatuhan terhadap proporsi pengurangan gambar, jika tidak maka akan ditampilkan dalam bentuk yang terdistorsi. Misalnya, untuk memasukkan gambar yang dibelah dua ke halaman dari file bernama SomePic.jpg, yang dimensi awalnya adalah 500 kali 300 piksel, tag dapat dilakukan dengan perintah berikut:
Langkah 2
Anda dapat mengatur pengurangan proporsional dari dimensi gambar asli dalam persen. Untuk melakukan ini, gunakan hanya atribut tinggi tanpa menentukan lebar, dan tambahkan tanda persen setelah menentukan nomor yang menentukan ukuran. Misalnya, Anda dapat mencapai efek yang sama seperti pada contoh dari langkah sebelumnya dengan tag yang ditulis dalam formulir ini:
Langkah 3
Jika Anda ingin menentukan ukuran gambar menggunakan deskripsi gaya, gunakan nama tag yang sama - img - dan atribut - lebar dan tinggi. Dalam hal ini, satuan pengukuran - px, pt atau% - harus selalu ditentukan. Untuk mengatur separuh ukuran semua gambar pada halaman, tempatkan entri berikut di blok deskripsi gaya: img {height: 50%;} Jika Anda perlu mengurangi ukuran hanya satu gambar, tambahkan atribut id tambahan ke tagnya dan tetapkan satu yang unik untuk gambar nilai halaman ini - misalnya, PicOne: Tambahkan nilai yang sama ke catatan gaya, pisahkan dengan "hash" # dari nama tag. Deskripsi gaya lengkap dalam hal ini mungkin terlihat seperti ini: img # OnePic {height: 50%;}
