ฉันต้องการรังspan
และa
แท็ก ฉันควร
- ใส่
<span>
ข้างใน<a>
- ใส่
<a>
ข้างใน<span>
- มันไม่สำคัญ?
ฉันต้องการรังspan
และa
แท็ก ฉันควร
<span>
ข้างใน<a>
<a>
ข้างใน<span>
คำตอบ:
3 - ไม่เป็นไร
แต่ฉันมักจะใช้เฉพาะ<span>
ภายใน<a>
ถ้าเป็นเพียงบางส่วนของเนื้อหาของแท็กเท่านั้น
<a href="#">some <span class="red">text</span></a>
ค่อนข้างมากกว่า:
<a href="#"><span class="red">some text</span></a>
ซึ่งเห็นได้ชัดว่าควรเป็น:
<a href="#" class="red">some text</a>
ถูกต้องอย่างสมบูรณ์ (อย่างน้อยตามมาตรฐาน HTML 4.01 และ XHTML 1.0) ที่จะซ้อนกัน<span>
ภายใน<a>
หรือ<a>
ภายในไฟล์<span>
.
เพื่อพิสูจน์ด้วยตัวคุณเองคุณสามารถตรวจสอบW3C MarkUp Validation Service ได้ตลอดเวลา
ฉันพยายามตรวจสอบความถูกต้อง:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Title</title>
</head>
<body>
<p>
<a href="http://www.google.com/"><span>Google</span></a>
</p>
</body>
</html>
และยังเหมือนกับด้านบน แต่มี<a>
ด้านใน<span>
กล่าวคือ
<span><a href="http://www.google.com">Google</a></span>
ที่มีทั้ง HTML 4.01 และ XHTML 1.0 เอกและทั้งสองผ่านการตรวจสอบความถูกต้องเรียบร้อยแล้ว!
สิ่งเดียวที่ควรระวังคือตรวจสอบให้แน่ใจว่าคุณปิดแท็กตามลำดับที่ถูกต้อง ดังนั้นหากคุณเริ่มต้นด้วย a <span>
แล้ว<a>
ตรวจสอบให้แน่ใจว่าคุณปิด<a>
แท็กก่อนก่อนที่จะปิด<span>
และในทางกลับกัน
ไม่เป็นไร - ทั้งคู่ได้รับอนุญาตจากกันและกัน
ขึ้นอยู่กับสิ่งที่คุณต้องการมาร์กอัป
<a>
<span>
<span>
ลงใน<a>
SPAN เป็นสามัญคอนเทนเนอร์แบบอินไลน์ ไม่สำคัญว่าa
จะอยู่ภายในspan
หรือspan
ภายในa
เนื่องจากทั้งสองเป็นองค์ประกอบแบบอินไลน์ อย่าลังเลที่จะทำสิ่งที่ดูเหมือนถูกต้องตามเหตุผลสำหรับคุณ
ขึ้นอยู่กับว่าสแปนมีไว้เพื่ออะไร หากอ้างถึงข้อความของลิงก์ไม่ใช่ข้อเท็จจริงที่ว่าเป็นลิงก์ให้เลือก # 1 หากช่วงนั้นอ้างถึงลิงก์โดยรวมให้เลือก # 2 เว้นแต่คุณจะอธิบายว่าสแปนหมายถึงอะไรก็ไม่มีคำตอบมากไปกว่านั้น ทั้งสองเป็นองค์ประกอบแบบอินไลน์สามารถซ้อนกันทางวากยสัมพันธ์ในลำดับใดก็ได้
อาจเป็นเรื่องสำคัญว่าคุณกำลังใช้แบบอักษรไอคอนการเรียงลำดับ ตอนนี้ฉันมีสิ่งนี้กับ:
<span class="fa fa-print fa-3x"><a href="some_link"></a></span>
โดยปกติฉันจะใส่สแปนไว้ใน A แต่การจัดแต่งทรงผมไม่ได้มีผลจนกว่าจะเปลี่ยนรอบ
โดยส่วนตัวแล้วในฐานะนักพัฒนาเว็บฉันเคยใส่ช่วงเวลาไว้ในแท็กจุดยึดหากฉันพยายามเน้นส่วนของข้อความลิงก์เช่นการใช้พื้นหลังกับส่วนหนึ่ง
มันจะใช้ได้ทั้งสองอย่าง แต่โดยส่วนตัวแล้วฉันชอบตัวเลือกที่ 2 ดังนั้นสแปนจึงเป็น "รอบ" ลิงก์
ในทางความหมายฉันคิดว่ามีความหมายมากกว่าเนื่องจากเป็นคอนเทนเนอร์สำหรับองค์ประกอบเดียวและหากคุณต้องการซ้อนองค์ประกอบเหล่านั้นสิ่งที่แนะนำมากกว่าองค์ประกอบจะอยู่ด้านในขององค์ประกอบด้านนอก