Cara Membuat Butang dalam HTML untuk Muat turun Fail

Pengarang: Eugene Taylor
Tarikh Penciptaan: 16 Ogos 2021
Tarikh Kemas Kini: 1 Disember 2024
Anonim
Create amazing buttons in Google Sites
Video.: Create amazing buttons in Google Sites

Kandungan

Pereka web sering menggunakan butang yang dibenamkan dalam dokumen HTML untuk tujuan fungsi dan estetik. Di samping menawarkan pengguna cara yang menyenangkan untuk menghantar maklumat atau membuat keputusan, butang membenarkan fungsi yang berbeza berdasarkan interaksi pengguna. Dalam artikel ini, butang HTML akan membolehkan pengguna memuat turun fail apabila ia diklik.


Arahan

Butang adalah komponen HTML yang berguna dan fleksibel (Hemera Technologies / PhotoObjects.net / Getty Images)
  1. Buat fail HTML dalam editor teks, seperti Notepad. Fail asas harus mengandungi sekurang-kurangnya tanda "html" dan "tubuh":

    >

    Tag "butang" mengandungi maklumat yang menggambarkan butang itu. Dalam kes ini, butang itu adalah "butang" generik dan namanya "Muat turun". Perkataan antara tanda "" akan muncul pada butang apabila halaman dipaparkan dalam penyemak imbas.

  2. Buat titik butang pada fail apabila ia diklik oleh pengguna. Untuk melakukan ini, tambah acara "onClick":

    Acara "onClick" akan berjalan apabila pengguna mengklik butang. Dalam hal ini ia akan membuka tetingkap baru yang menunjuk ke alamat fail.


  3. Simpan fail tersebut dan buka dalam pelayar web anda. Simpan dengan lanjutan "html" (sebagai contoh, "test.html"). Buka dalam penyemak imbas. Butang akan muncul di sudut kiri atas tetingkap dan satu klik akan memajukan pengguna ke fail dan memulakan proses muat turun.

Bagaimana

  • Kod ini boleh disalin dan disisipkan ke dalam mana-mana dokumen HTML. Baca laman web "W3C Schools" (w3schools.com) untuk mengetahui lebih lanjut mengenai apa yang boleh dilakukan oleh butang HTML.

Apa yang anda perlukan

  • Editor teks
  • Pelayar web

Rujukan

  • W3C Schools: HTML Tag "button"
  • JavaScript Coder: Menggunakan Kaedah Window.Open

Penerbangan

  • W3C Schools: HTML Tag "button"