Rumah >hujung hadapan web >tutorial css >Mengapa Tag Anchor Mengabaikan Ketinggian Bekas Tetapi Menghormati Lebar?

Mengapa Tag Anchor Mengabaikan Ketinggian Bekas Tetapi Menghormati Lebar?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-12-01 12:58:12166semak imbas

Why Do Anchor Tags Ignore Container Height But Respect Width?

Mengapa Anchor Tag Mengabaikan Tinggi dan Lebar Bekasnya

Dalam HTML, teg anchor () selalunya kelihatan mengabaikan sifat ketinggian dan lebar yang ditetapkan untuk unsur-unsur yang mengandunginya. Ini boleh diperhatikan dengan memeriksa saiz elemen tersebut menggunakan alat pembangun, seperti yang digambarkan dalam JsFiddle yang disediakan.

Pengiraan Ketinggian

Spesifikasi CSS 2.1 menentukan bahawa ketinggian kawasan kandungan tag anchor ditentukan semata-mata oleh metrik fonnya. Sebagai teg sauh lalai kepada paparan sebaris, mereka pada dasarnya membungkus diri mereka di sekeliling kandungannya. Oleh itu, sifat ketinggian tidak digunakan pada elemen sebaris seperti teg sauh.

Dalam contoh yang disediakan, satu baris teks dalam teg sauh menentukan ketinggian 18px, tanpa mengira spesifikasi ketinggian elemen sekeliling.

Pengiraan Lebar

Walaupun tag sauh tidak mematuhi sifat ketinggian bekasnya, ia tetap mengambil bahagian dalam pengiraan lebar. Walau bagaimanapun, lebar ditentukan oleh kandungan elemen itu sendiri, termasuk pelapik, jidar dan jidar.

Untuk teg penambat pertama, lebar dikira sebagai:

  • Lebar kandungan (ruang imej): 114px
  • Biping kiri: 20px
  • Kiri dan sempadan kanan: 2x5px
  • Jumlah lebar: 144px

Begitu juga, lebar teg sauh kedua ditentukan sebagai:

  • Lebar kandungan (imej ): 280px
  • Jing kiri: 20px
  • Sempadan kiri dan kanan: 2x5px
  • Jumlah lebar: 310px

Selain itu, jarak dalam kandungan tag anchor mempengaruhi pengiraan lebar. Ruang pada permulaan teg pertama dan penghujung teg kedua diabaikan kerana pemformatan sebaris, manakala ruang di antaranya diruntuhkan menjadi satu. Ruang yang satu ini menyumbang kepada lebar teg pertama tetapi bukan yang kedua.

Atas ialah kandungan terperinci Mengapa Tag Anchor Mengabaikan Ketinggian Bekas Tetapi Menghormati Lebar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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