번역: HTML 코드를 아름답게 작성하는 방법_HTML/Xhtml_웹페이지 제작
- WBOY원래의
- 2016-05-16 16:43:251437검색
아름다운 HTML 코드의 모습 아름다운 HTML 코드를 작성하는 방법.
외국인이 쓴 글: 아름다운 HTML 코드 작성법. 글이 참 좋은 것 같아 재인쇄해서 공유합니다:
ps: 원본 주소: http :// css-tricks.com/what-beautiful-html-code-looks-like/
1.DOCTYPE이 올바르게 선언됨
헤더 선언을 잊지 마세요. 헤더 선언은 브라우저에 HTML 렌더링 방법을 알려줍니다.
2. Tidy Head 섹션
CSS와 JS(인쇄용 CSS 포함)를 외부적으로 연결하기 위한 제목과 문자 세트를 설정합니다.
3.신체 ID
신체에 ID를 부여하세요. 여기서 저자가 언급한 이유는 여러 페이지에 대한 컨테이너 선택을 용이하게 하기 위한 것입니다. 예를 들어 page1과 page2의 BODY에 서로 다른 ID를 설정하면 #page1 h2와 #page2 h2를 통해 두 가지 다른 효과를 설정할 수 있는데 이는 사용하기 전에 상황과 특정 아키텍처에 따라 다르다고 생각합니다.
4.의미적으로 깔끔한 메뉴
의미에 맞는 메뉴 코드를 작성하세요.
<div id="menu">
<code><div id="menu">
<br><ul>
<br><li><a href="index.php">Home</a></li>
<br><li><a href="about.php">About</a></li>
<br><li><a href="contact.php">Contact</a></li>
<br>
</ul>
<br>
</div>
<br>ps:我个人觉得这样写代码应该更简单一点吧:<br><ulid><br><li><a href="index.php">Home</a></li>
<br><li><a href="about.php">About</a></li>
<br><li><a href="contact.php">Contact</a></li>
<br><br></ulid>
5.모든 페이지 콘텐츠를 위한 메인 DIV
모든 콘텐츠를 담고 있는 메인 DIV가 있어야 합니다. 본문의 너비, 여백 등을 고정하는 것이 편리합니다.
6.중요한 내용 먼저
메인 내용을 먼저 작성하고, 네비게이션이나 사이드바가 별로 중요하지 않다면 마지막에 작성하는 것이 좋습니다.
7.공통 콘텐츠 포함
PHP의 include와 같은 동적 호출을 통해 탐색, 페이지 바닥글 등 공통적인 부분을 소개합니다.
8.탭으로 구분된 코드
들여쓰기된 코드
9.올바른 종료 태그
닫는 태그에 주의하세요
10.헤더 태그의 계층
~ 등의 헤더 태그를 적절한 위치에 사용하여 단락을 구분하세요.
11. 콘텐츠, 콘텐츠적절한 태그와 로고 코드를 사용하고, ©를 표시하려면 &를 사용하세요. 는 사용하지 마세요.
12.스타일 지정 금지!태그에 스타일을 쓰지 마세요. HTML은 구조를 표현하는 데에만 사용됩니다. 성능은 CSS에 맡기자.
들여쓰기된 코드
9.올바른 종료 태그
닫는 태그에 주의하세요
10.헤더 태그의 계층
~ 등의 헤더 태그를 적절한 위치에 사용하여 단락을 구분하세요.
11. 콘텐츠, 콘텐츠적절한 태그와 로고 코드를 사용하고, ©를 표시하려면 &를 사용하세요. 는 사용하지 마세요.
12.스타일 지정 금지!태그에 스타일을 쓰지 마세요. HTML은 구조를 표현하는 데에만 사용됩니다. 성능은 CSS에 맡기자. 성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.