Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Membuat Tag Anchor Menjangkau Lebar Penuh Item Senarai?

Bagaimana untuk Membuat Tag Anchor Menjangkau Lebar Penuh Item Senarai?

Linda Hamilton
Linda Hamiltonasal
2024-10-29 05:43:31467semak imbas

How to Make Anchor Tags Span the Full Width of List Items?

Teg Sauh Lebar Penuh dalam Item Senarai

Pengenalan

Apabila mereka bentuk menu navigasi, adalah perkara biasa untuk menginginkan teg sauh () untuk meregangkan seluruh lebar item senarai (

  • ). Walau bagaimanapun, menetapkan atribut lebar pada teg biasanya tidak mempunyai kesan.

    Penyelesaian

    Untuk mencapai kesan regangan ini, kita mesti menukar sifat paparan tag anchor. Elemen sebaris seperti tidak boleh ditetapkan lebarnya. Sebaliknya, kita perlu menukarnya kepada elemen sekat atau sekatan sebaris:

    <code class="css">a.wide {
        display: block;
    }</code>

    Penggunaan

    Setelah peraturan CSS ditakrifkan, tambahkan kelas "lebar" pada teg sauh dalam

  • elemen:

    <code class="html"><ul id="menu">
      <li><a class="wide" href="javascript:;">Home</a></li>
      <li><a class="wide" href="javascript:;">Test</a></li>
    </ul></code>

    Nota

    • Dalam Internet Explorer 6, adalah mungkin untuk menetapkan lebar elemen sebaris, tetapi ini disebabkan oleh pelaksanaan CSS yang salah.

    Atas ialah kandungan terperinci Bagaimana untuk Membuat Tag Anchor Menjangkau Lebar Penuh Item Senarai?. 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