tetapan html (-)

王林
Lepaskan: 2023-05-27 10:16:07
asal
604 orang telah melayarinya

HTML ialah salah satu bahasa terpenting dalam penghasilan halaman web dan boleh menentukan susun atur dan susun atur halaman web. Dalam HTML, kita boleh menetapkan atribut pelbagai elemen untuk mengawal kesan paparan halaman web. Salah satu cara untuk menetapkan sifat adalah dengan menggunakan simbol "-".

1. "-" dalam nama atribut CSS

CSS ialah bahasa helaian gaya yang digunakan untuk mencantikkan halaman web Seperti bahasa HTML, simbol "-" juga digunakan untuk memisahkan perkataan. Menerangkan nilai atribut komposit.

Sebagai contoh, atribut warna latar belakang boleh ditulis sebagai "warna latar belakang" dan saiz fon boleh ditulis sebagai "saiz fon". Cara penulisan ini dipanggil "penamaan sempang" dalam CSS dan membantu meningkatkan kebolehbacaan nama atribut.

2. Atribut data tersuai

Dalam HTML5, kami boleh menggunakan awalan "data-" untuk menyesuaikan atribut data untuk menambahkan atribut tersuai pada elemen HTML supaya kami boleh membacanya dalam JavaScript Get dan beroperasi pada data unsur ini.

Sebagai contoh, kami boleh menambah atribut data-* pada elemen HTML untuk menyimpan maklumat tersuai yang berkaitan dengan elemen, seperti id artikel, masa penerbitan, dsb.

Kod HTML:

<div id="article-123" data-time="2020-12-01">
  <h2>文章标题</h2>
  <p>文章内容</p>
</div>
Salin selepas log masuk

Kod JavaScript:

const article = document.getElementById('article-123');
console.log(article.dataset.time); // 2020-12-01
Salin selepas log masuk

3 Jenis kotak input

Dalam HTML, kita boleh menetapkan atribut jenis elemen input , untuk menentukan jenis kotak input. Jenis kotak input yang biasa digunakan termasuk kotak teks, kotak kata laluan, butang radio, kotak semak, butang hantar, dsb.

Sebagai contoh, kita boleh menetapkan jenis kepada "teks" untuk mencipta kotak input teks, dan menetapkan jenis kepada "kata laluan" untuk mencipta kotak input kata laluan. Pada masa yang sama, kami juga boleh menetapkan berbilang kotak berbilang pilihan dengan atribut nama yang sama untuk merealisasikan fungsi berbilang pilih.

Kod HTML:

<form>
  <label for="username">用户名: </label>
  <input type="text" id="username" name="username"><br>

  <label for="password">密码: </label>
  <input type="password" id="password" name="password"><br>

  <label for="gender-male">男: </label>
  <input type="radio" id="gender-male" name="gender" value="male">

  <label for="gender-female">女: </label>
  <input type="radio" id="gender-female" name="gender" value="female"><br>

  <label for="fruits">选择水果: </label>
  <input type="checkbox" name="fruits" value="apple">苹果
  <input type="checkbox" name="fruits" value="banana">香蕉
  <input type="checkbox" name="fruits" value="orange">橙子<br>

  <input type="submit" value="提交">
</form>
Salin selepas log masuk

4 Penyambung dalam URL

Dalam URL, kami menggunakan simbol "-" atau simbol "_" untuk menggantikan ruang untuk kemudahan. Enjin carian menghuraikan kata kunci dalam URL dengan betul. Pada masa yang sama, kita juga boleh menggunakan simbol "-" dan bukannya simbol "/" untuk memudahkan laluan URL.

5. Ringkasan

Dalam HTML, menggunakan simbol "-" boleh membantu kami menetapkan atribut CSS, atribut data tersuai, jenis kotak input dan penyambung URL, meningkatkan kecekapan dan kecekapan halaman web pengeluaran. Sama pentingnya, kita perlu mematuhi piawaian dan semantik HTML untuk memberikan pengguna pengalaman menyemak imbas yang lebih baik.

Atas ialah kandungan terperinci tetapan html (-). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan