ช่วงในจุดยึดหรือจุดยึดภายในช่วงหรือไม่สำคัญ?


109

ฉันต้องการรังspanและaแท็ก ฉันควร

  1. ใส่<span>ข้างใน<a>
  2. ใส่<a>ข้างใน<span>
  3. มันไม่สำคัญ?

คำตอบ:


110

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>

1
ฉันเพิ่งเจอปัญหาช่องว่างที่มีข้อความล้น: จุดไข่ปลาและโอเวอร์โฟลว์: ซ่อนซึ่งสามารถแก้ไขได้โดยการเพิ่มองค์ประกอบอินไลน์บล็อกในปุ่มนำทางของฉัน ฉันลงเอยด้วย <a> <span> ข้อความ </span> </a> ดังนั้นฉันคิดว่า (หรือหวังว่า;)) สามารถทำสิ่งนี้ได้เมื่อคุณต้องการจริงๆ
CunningFatalist

ฉันจะเลือกตัวเลือกที่ 2 เพราะมันสำคัญ Anchor ควรใช้สำหรับการยึดเท่านั้นไม่ใช่สำหรับการมีองค์ประกอบ (แนวทางปฏิบัติที่ดีที่สุด) ลองนึกภาพสถานการณ์ที่คุณสร้างไทล์ที่คลิกได้และจุดยึดเป็นองค์ประกอบหลักของคอมโพเนนต์ไทล์และภายในคอมโพเนนต์คือลิงก์สำหรับรูปภาพและรูปภาพอื่น ๆ โปรแกรมรวบรวมข้อมูลของ Google จะบ้าคลั่งและในที่สุดมันก็ไม่ดีสำหรับไซต์ของคุณ
Imam Bux

33

ถูกต้องอย่างสมบูรณ์ (อย่างน้อยตามมาตรฐาน 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>และในทางกลับกัน


20

ไม่เป็นไร - ทั้งคู่ได้รับอนุญาตจากกันและกัน


แต่ <a> เป็นระดับบล็อกและ <span> เป็นองค์ประกอบระดับอินไลน์และองค์ประกอบระดับบล็อกไม่สามารถเข้ามาในองค์ประกอบแบบอินไลน์ได้ ฉันคิดว่ามันอยู่ในการตรวจสอบ w3c
Jitendra Vyas

26
ไม่ทั้งคู่อยู่ในแนวเดียวกัน
Greg

16

ขึ้นอยู่กับสิ่งที่คุณต้องการมาร์กอัป

  • ถ้าคุณต้องการการเชื่อมโยงภายในช่วงที่ใส่ภายใน<a><span>
  • หากคุณต้องการมาร์กอัปบางอย่างในลิงก์ให้ใส่<span>ลงใน<a>

16

SPAN เป็นสามัญคอนเทนเนอร์แบบอินไลน์ ไม่สำคัญว่าaจะอยู่ภายในspanหรือspanภายในaเนื่องจากทั้งสองเป็นองค์ประกอบแบบอินไลน์ อย่าลังเลที่จะทำสิ่งที่ดูเหมือนถูกต้องตามเหตุผลสำหรับคุณ


2

ขึ้นอยู่กับว่าสแปนมีไว้เพื่ออะไร หากอ้างถึงข้อความของลิงก์ไม่ใช่ข้อเท็จจริงที่ว่าเป็นลิงก์ให้เลือก # 1 หากช่วงนั้นอ้างถึงลิงก์โดยรวมให้เลือก # 2 เว้นแต่คุณจะอธิบายว่าสแปนหมายถึงอะไรก็ไม่มีคำตอบมากไปกว่านั้น ทั้งสองเป็นองค์ประกอบแบบอินไลน์สามารถซ้อนกันทางวากยสัมพันธ์ในลำดับใดก็ได้


ถูกต้องทั้งคู่เป็นองค์ประกอบแบบอินไลน์
คริส

2

อาจเป็นเรื่องสำคัญว่าคุณกำลังใช้แบบอักษรไอคอนการเรียงลำดับ ตอนนี้ฉันมีสิ่งนี้กับ:

<span class="fa fa-print fa-3x"><a href="some_link"></a></span>

โดยปกติฉันจะใส่สแปนไว้ใน A แต่การจัดแต่งทรงผมไม่ได้มีผลจนกว่าจะเปลี่ยนรอบ


1

โดยส่วนตัวแล้วในฐานะนักพัฒนาเว็บฉันเคยใส่ช่วงเวลาไว้ในแท็กจุดยึดหากฉันพยายามเน้นส่วนของข้อความลิงก์เช่นการใช้พื้นหลังกับส่วนหนึ่ง


0

มันจะใช้ได้ทั้งสองอย่าง แต่โดยส่วนตัวแล้วฉันชอบตัวเลือกที่ 2 ดังนั้นสแปนจึงเป็น "รอบ" ลิงก์


0

ในทางความหมายฉันคิดว่ามีความหมายมากกว่าเนื่องจากเป็นคอนเทนเนอร์สำหรับองค์ประกอบเดียวและหากคุณต้องการซ้อนองค์ประกอบเหล่านั้นสิ่งที่แนะนำมากกว่าองค์ประกอบจะอยู่ด้านในขององค์ประกอบด้านนอก

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.