Web Page Teaching Network의 이전 튜토리얼에서는 웹 페이지 HTML 파일을 의미 있게 만드는 것이 여러 번 강조되었습니다. 모양에 따라 선택하기보다는 웹 페이지의 HTML 문서 구조에 따라 가장 적합한 HTML 또는 XHTML 태그를 선택해야 합니다. 줄 바꿈 효과를 얻기 위해 P 태그를 사용하는 대신 단락을 정의하려면 P 태그를 사용하십시오. 텍스트 크기와 굵은 효과를 얻기 위해 h1-h6 태그를 사용하는 대신 제목을 표시하는 데 사용합니다.
예를 들어 제목의 경우 h1을 사용하여 정의할 수 있습니다.
<h1>여기에 기사의 제목 텍스트를 작성하세요</h1>
다른 방법으로 정의하는 대신:
<p style="font-size:16px;font-weight:bold;">여기에 기사의 제목 텍스트를 쓰세요</p>
Web Teaching Network의 이전 기사에서는 XHTML1.0에서 허용하는 모든 태그를 나열했으며 실제로 선택할 수 있는 요소 태그가 거의 없음을 알 수 있습니다. 그러나 우리는 이러한 정제된 요소 표시가 더 명확한 의미를 갖고 있음도 분명히 알고 있습니다. 태그할 올바른 요소를 실제로 찾을 수 없는 경우 일반 div 및span 태그를 사용할 수 있습니다.
페이지에서 div 및span 태그를 사용하는 것은 새로운 문제이며 우리는 이를 너무 많이 사용하는 경향이 있습니다. div를 필요하고 합리적으로 사용하면 문서 구조가 크게 향상될 수 있습니다. HTML 문서를 보고 많은 div와 범위가 있는 것을 발견하면 다른 관점에서 문제를 보아야 합니다. 남용이 있습니까? 이를 대체할 수 있는 더 좋은 마커가 있습니까? h1이 표시된 콘텐츠를 더 잘 표현할 수 있다면 이를 정의하기 위해 p 또는 범위를 포기해야 합니다.
어쩌면 이것은 한 쌍의 모순으로 인해 이를 올바르게 사용하는 방법을 파악하기 어렵거나 전혀 명확한 답을 얻을 수 없는 것일 수도 있습니다. 하지만 한 가지 분명히 해야 할 것은 문서가 명확한 논리적 구조를 갖고 스타일을 적용하기 쉽게 만들어야 한다는 것입니다. div를 단지 컨테이너 또는 문서의 "일부"로 생각할 수 있습니다. 우리는 너무 많은 컨테이너를 사용하는데 이는 현명한 패턴이 아닙니다. 그리고 딱 맞고 합리적인 위치에 있는 컨테이너는 전체 문서를 정리된 것처럼 보이게 할 수 있습니다.
다음 코드가 더 합리적이고 효과적입니다.
| 인용된 내용은 다음과 같습니다. <div id="헤더"> |