앵커 내부 스팬 또는 스팬 내부 앵커 또는 중요하지 않습니까?
중첩 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>
<span>내부 <a>또는 내부 에 중첩하는 것이 (적어도 HTML 4.01 및 XHTML 1.0 표준에 의해) 완벽하게 유효 <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 doctype을 모두 사용했으며 둘 다 성공적으로 유효성 검사를 통과했습니다!
주의해야 할 것은 올바른 순서로 태그를 닫는 것뿐입니다. 당신이 시작한다면 <span>다음 <a>, 당신은 가까이 있는지 확인 <a>을 닫기 전에 먼저 태그를 <span>그 반대의 경우도 마찬가지입니다.
상관 없습니다. 둘 다 서로 내부에 허용됩니다.
마크 업하려는 항목에 따라 다릅니다.
- 당신이 범위 안에 링크를 원하는 경우, 넣어
<a>내부<span>. - 당신이 링크에서 뭔가를 마크 업하려면, 넣어
<span>로<a>
SPAN은 GENERIC 인라인 컨테이너입니다. 그것은 여부를 중요하지 않습니다 a내부에 span또는 span안에 a모두 인라인 요소로. 논리적으로 옳다고 생각되는 것은 무엇이든 자유롭게하십시오.
스팬이 무엇인지에 따라 다릅니다. 링크라는 사실이 아니라 링크의 텍스트를 참조하는 경우 # 1을 선택하십시오. 범위가 링크 전체를 참조하는 경우 # 2를 선택합니다. 스팬이 무엇을 나타내는 지 설명하지 않는 한, 그 이상의 답은 없습니다. 둘 다 인라인 요소이며 구문 상 임의의 순서로 중첩 될 수 있습니다.
개인적으로 웹 개발자로서 저는 한 섹션에 배경을 적용하는 것과 같이 링크 텍스트의 섹션을 강조 표시하려는 경우에만 앵커 태그 내에 스팬을 넣었습니다.
예를 들어 정렬 아이콘 글꼴을 사용하는 것이 중요 할 수 있습니다. 나는 이것을 방금 가지고 있었다.
<span class="fa fa-print fa-3x"><a href="some_link"></a></span>
일반적으로 나는 A 안에 스팬을 넣을 것이지만 스타일링은 라운드를 바꿀 때까지 효과가 없었습니다.
둘 다 작동하지만 개인적으로 옵션 2를 선호하므로 범위가 링크 "주변"에 있습니다.
의미 론적으로는 단일 요소에 대한 컨테이너가 더 합리적이라고 생각하며 중첩해야하는 경우 요소보다 더 많은 요소가 외부 요소 내부에 있음을 제안합니다.
'Programming' 카테고리의 다른 글
| 여러 매개 변수와 함께 VaryByParam을 어떻게 사용합니까? (0) | 2020.08.17 |
|---|---|
| 파일을 grep하고 다음 5 줄을 얻는 방법 (0) | 2020.08.17 |
| 어떤 문자 키를 눌렀는지 확인하는 방법은 무엇입니까? (0) | 2020.08.17 |
| git에서 gitignore 명령을 사용하는 방법 (0) | 2020.08.17 |
| ggplot은 외부에서 작동하지만 for 루프 내부에 있으면 작동하지 않습니다. [중복] (0) | 2020.08.17 |