Câu trả lời:
3 - Không thành vấn đề.
NHƯNG, tôi có xu hướng chỉ sử dụng <span>
bên trong một <a>
nếu nó chỉ cho một phần nội dung của thẻ, tức là
<a href="#">some <span class="red">text</span></a>
Thay vì:
<a href="#"><span class="red">some text</span></a>
Mà rõ ràng chỉ nên là:
<a href="#" class="red">some text</a>
Việc lồng một <span>
bên trong một <a>
hoặc một <a>
bên trong a là hoàn toàn hợp lệ (ít nhất là theo tiêu chuẩn HTML 4.01 và XHTML 1.0) <span>
.
Chỉ để chứng minh điều đó cho chính mình, bạn luôn có thể kiểm tra Dịch vụ xác thực W3C MarkUp
Tôi đã thử xác thực:
<!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>
Và cũng tương tự như trên, nhưng với <a>
bên trong<span>
I E
<span><a href="http://www.google.com">Google</a></span>
với cả hai loại tài liệu HTML 4.01 và XHTML 1.0 và cả hai đều đã vượt qua xác thực thành công!
Điều duy nhất cần lưu ý là đảm bảo rằng bạn đóng các thẻ theo đúng thứ tự. Vì vậy, nếu bạn bắt đầu bằng <span>
sau đó là an <a>
, hãy đảm bảo rằng bạn đóng <a>
thẻ trước khi đóng <span>
và ngược lại.
Không quan trọng - cả hai đều được phép ở bên trong nhau.
Nó phụ thuộc vào nhịp dành cho mục đích gì. Nếu nó đề cập đến văn bản của liên kết chứ không phải thực tế là nó là một liên kết, hãy chọn # 1. Nếu nhịp đề cập đến liên kết nói chung, thì hãy chọn # 2. Trừ khi bạn giải thích nhịp đại diện cho điều gì, không có nhiều câu trả lời hơn thế. Chúng đều là phần tử nội tuyến, có thể được lồng ghép theo cú pháp theo bất kỳ thứ tự nào.
Có thể có vấn đề nếu chẳng hạn bạn đang sử dụng một số phông chữ biểu tượng sắp xếp. Tôi vừa có cái này với:
<span class="fa fa-print fa-3x"><a href="some_link"></a></span>
Thông thường tôi sẽ đặt khoảng bên trong chữ A nhưng kiểu dáng không có hiệu lực cho đến khi đổi nó vòng.