오늘 웹 페이지의 HTML 마크 업을 보면 다른 HTML 요소에 HTML 요소가 포함되어있는 것을 볼 수 있습니다. 다른 요소의 "내부"에있는 이러한 요소는 "중첩 요소"로 알려져 있으며 오늘날 웹 페이지를 작성하는 데 필수적입니다.
HTML 태그를 중첩하는 것은 무엇을 의미합니까?
중첩을 이해하는 가장 쉬운 방법은 HTML 태그를 콘텐츠를 보관하는 상자로 생각하는 것입니다. 콘텐츠에는 텍스트, 이미지 등이 포함될 수 있습니다. HTML 태그는 콘텐츠 주변의 상자입니다. 때로는 상자를 다른 상자 안에 넣어야합니다. 그 "내부"상자는 다른 상자 안에 중첩되어 있습니다.
단락 안에 굵게 표시하려는 텍스트 블록이있는 경우 텍스트 자체뿐만 아니라 두 개의 HTML 요소가 있습니다.
예 : 이것은 문장 텍스트.
이 텍스트는 우리가 예제로 사용할 것입니다. 여기에 그것이 쓰여지는 방법이 있습니다.
예 : 이것은 텍스트의 문장입니다. "문장"이라는 단어를 굵게 표시하려면 해당 단어 앞뒤에 굵은 태그를 열고 닫습니다.
예 : 이것은 문장 텍스트. 보시다시피, 문장의 내용 / 텍스트와 두 번째 상자 (강력한 태그 쌍)가 포함 된 하나의 상자 (단락)가 있는데,이 단어는 굵게 표시됩니다. 태그를 중첩 할 때 태그를 열 때 반대 순서로 태그를 닫는 것이 매우 중요합니다. 당신은 먼저, , 그것은 당신이 그것을 뒤집고 그리고 나서 이것을 생각하는 또 다른 방법은 상자의 비유를 다시 사용하는 것입니다. 상자를 다른 상자 안에 넣으면 바깥 쪽 상자 나 상자를 닫기 전에 안쪽 상자를 닫아야합니다. 한 두 단어 만 굵게 표시하고 다른 단어를 기울임 꼴로 표시하려면 어떻게해야합니까? 방법은 다음과 같습니다. 예 : 이것은 문장 텍스트의 일부이며 또한 기울임 꼴 텍스트 너무. 우리의 바깥 상자 인 안에 두 개의 중첩 태그가 있습니다. 그리고 . 상자를 닫을 수 있으려면 둘 다 닫아야합니다. 예 : 이것은 문장 텍스트의 일부이며 또한 기울임 꼴 텍스트 너무. 이것은 또 다른 단락입니다. 이 경우 상자 안에 상자가 있습니다! 가장 많은 상자는 중첩에 신경을 써야하는 가장 큰 이유 중 하나는 CSS를 사용하는 경우입니다. 계단식 스타일 시트는 스타일이 시작되고 끝나는 위치를 알 수 있도록 문서 내에서 일관되게 중첩되도록 태그에 의존합니다. 페이지의 '주 내용'클래스의 텍스트가있는 부서의 내부에있는 모든 "링크"에 영향을주는 스타일을 설정하면 잘못된 중첩으로 인해 브라우저가 이러한 스타일을 적용 할 위치를 알기가 어려워집니다. HTML을 살펴 보겠습니다. 예 : 이것은 문장 텍스트의 일부이며 또한 기울임 꼴 텍스트 너무. 이것은 또 다른 단락입니다. 예제를 사용하여 방금 언급 한 바와 같이이 부서 내부의 링크에 영향을 미칠 CSS 스타일을 작성하고 해당 링크 (페이지의 다른 섹션에있는 다른 링크와 반대)를 작성하려면 내 스타일을 쓰는 중첩, 같은 : .main-content a { color : # F00;}
다른 이유는 접근성과 브라우저 호환성을 포함합니다. HTML이 틀리게 중첩되어 있으면 화면 판독기와 구형 브라우저에서 액세스 할 수 없으며 HTML 요소와 태그가 있기 때문에 브라우저가 페이지를 올바르게 렌더링하는 방법을 알 수 없으면 페이지의 시각적 모양을 완전히 깨뜨릴 수도 있습니다 제자리에 없어요. 마지막으로, 정확하고 유효한 HTML을 작성하기 위해 노력한다면 올바른 중첩을 사용해야합니다. 그렇지 않으면 모든 유효성 검사기가 HTML에 잘못된 플래그를 지정합니다. 더 많은 중첩 태그 추가
중첩에 관심을 가져야하는 이유
