Latest web development tutorials

image HTML

contoh

Norwegian Mountain Trip

Pulpit Rock

Coba »

contoh

contoh online

Menyisipkan gambar
Contoh ini menunjukkan bagaimana untuk menampilkan gambar di halaman Web.

Menyisipkan gambar dari lokasi yang berbeda
Contoh ini menunjukkan bagaimana folder atau server yang berbeda gambar untuk menampilkan halaman Web.

(Anda dapat menemukan lebih banyak contoh di bagian bawah halaman ini.)


image HTML - tag gambar (<img>) dan atribut sumber (Src)

Dalam HTML, gambar didefinisikan oleh tag <img>.

<Img> tag kosong, yang berarti bahwa itu berisi atribut, dan tidak menutup tag.

Untuk menampilkan gambar pada halaman, Anda perlu menggunakan atribut sumber (src). src mengacu pada "sumber". Nilai dari atribut sumber adalah URL gambar.

sintaks gambar khusus adalah:

<img src="url" alt="some_text">

URL mengacu pada lokasi penyimpanan gambar. Jika gambar bernama "boat.gif" terletak www.w3school.com.cn direktori gambar, maka URL tersebut http://www.w3school.com.cn/images/boat.gif.

browser akan menampilkan gambar dalam dokumen mana tag gambar muncul. Jika Anda memasang tag gambar antara dua paragraf, browser pertama akan menampilkan paragraf pertama, dan kemudian menampilkan gambar yang ditampilkan terakhir paragraf kedua.


gambar HTML - Alt Atribut

Atribut alt digunakan sebagai definisi alternatif dari string gambar teks disiapkan.

Ganti properti teks nilai-nilai yang ditetapkan pengguna.

<img src="boat.gif" alt="Big Boat">

Ketika browser tidak dapat memuat gambar, ganti atribut teks memberitahu pembaca mereka kehilangan informasi. Dalam hal ini, browser akan menampilkan teks alternatif daripada gambar. Gambar di halaman digabungkan dengan properti substitusi teks adalah kebiasaan yang baik, yang membantu untuk menampilkan informasi yang lebih baik, dan bagi mereka yang menggunakan peramban teks biasa adalah sangat berguna.


Gambar HTML - Mengatur tinggi gambar dan lebar

height (tinggi) dan lebar (width) properti untuk pengaturan lebar dan tinggi gambar.

Nilai atribut default dalam piksel:

<img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228">

Tip: Sebuah citra yang baik dari ketinggian tertentu dan lebar kebiasaan. Ini akan mempertahankan ukuran tertentu jika tinggi gambar ditentukan lebar, ketika beban halaman. Jika Anda tidak menentukan ukuran gambar, adalah mungkin ketika beban halaman akan merusak tata letak keseluruhan halaman HTML.


tindakan pencegahan dasar - tips berguna:

Catatan: Jika file HTML berisi sepuluh gambar, maka dalam rangka untuk menampilkan halaman ini dengan benar, Anda perlu memuat 11 file.Beban gambar membutuhkan waktu, jadi saran kami adalah: gambar hati-hati.

Catatan: Ketika halaman dibuka, memperhatikan menyisipkan path halaman gambar, jika posisi gambar tidak dapat diatur dengan benar, browser tidak bisa memuat gambar, tag gambar akan menampilkan gambar yang rusak.


contoh

contoh yang lebih

gambar pengaturan
Contoh ini menunjukkan bagaimana mengatur gambar dalam teks.

mengambang Images
Contoh ini menunjukkan bagaimana membuat gambar melayang ke paragraf kiri atau kanan.

Pengaturan image link
Contoh ini menunjukkan bagaimana menggunakan gambar sebagai link.

Membuat peta gambar
Contoh ini menunjukkan bagaimana untuk membuat peta gambar dengan daerah yang dapat diklik. Masing-masing daerah adalah hyperlink.


tag gambar HTML

标签 描述
<img> 定义图像
<map> 定义图像地图
<area> 定义图像地图中的可点击区域