Bolehkah saya Sarang `` Di Dalam `` dalam Borang Bootstrap?-tutorial css-php.cn

Can I Nest a `` Inside a `` in a Bootstrap Form?

Nest Div Inside Label dalam Borang Bootstrap

Apabila menggunakan Bootstrap untuk mencipta borang mendatar, templat lalai kerap memberikan ID kepada setiap medan input. Untuk mengelakkan ini, sesetengah pembangun cuba untuk menyertakan medan input dan labelnya dalam peringkat blok

elemen di dalam teg, seperti berikut:

<form class="form-horizontal" role="form">
  <div class="form-group">
    <label class="block">
      <span class="col-lg-2 control-label">Email</span>
      <div class="col-lg-10">
        <input type="email" class="form-control">
      </div>
    </label>
  </div>
</form>

Salin selepas log masuk

Walaupun pendekatan ini nampaknya menyelesaikan isu, ia bercanggah dengan piawaian HTML.

Menangani Ketidakserasian

Mengikut spesifikasi HTML, elemen tidak boleh mengandungi

unsur. Spesifikasi secara eksplisit menyatakan bahawa model kandungan elemen hanya membenarkan kandungan frasa, yang termasuk elemen sebaris seperti dan , tetapi bukan elemen peringkat blok seperti

Oleh itu, bersarang

peringkat blok; di dalam elemen ialah tingkah laku yang tidak betul.

Penyelesaian Kemungkinan

Jika anda ingin mengelak daripada menggunakan ID untuk medan input sambil mengekalkan struktur HTML yang betul, pertimbangkan untuk menggunakan atribut "untuk" pada elemen untuk mengaitkannya dengan medan input tertentu:

<form class="form-horizontal" role="form">
  <div class="form-group">
    <label for="inputEmail1" class="col-lg-2 control-label">Email</label>
    <div class="col-lg-10">
      <input type="email" class="form-control">

Salin selepas log masuk

Atas ialah kandungan terperinci Bolehkah saya Sarang `` Di Dalam `` dalam Borang Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Bagaimanakah Saya Boleh Mencipta Kesan Hover pada Elemen Pseudo CSS? Artikel seterusnya：Bolehkah Atribut Data CSS Menghasilkan Aksara Baris Baharu dengan Unsur Pseudo?

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

Artikel terbaru oleh pengarang

Isu terkini

function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...

daripada 2024-04-29 11:01:01

1968

Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?

daripada 2024-04-23 00:22:19

2127

Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.

daripada 2024-04-19 15:37:47

1795

Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...