이 섹션에서는 HTML의 목록 요소에 대해 연구합니다. 목록 형식은 웹사이트 디자인에서 큰 역할을 합니다. 표시되는 정보는 매우 깔끔하고 직관적이어서 사용자가 쉽게 이해할 수 있습니다. 다음 CSS 스타일 학습에서는 목록 요소의 고급 기능을 광범위하게 사용합니다.
데이터 정리 목록
웹페이지 표시를 제어하는 수많은 HTML 태그를 학습한 후 독자는 처음에 순수한 기사 페이지를 만들 수 있습니다. 이 섹션에서는 HTML의 목록 요소에 대해 연구합니다. 목록 형식은 웹사이트 디자인에서 큰 역할을 합니다. 표시되는 정보는 매우 깔끔하고 직관적이어서 사용자가 쉽게 이해할 수 있습니다. 다음 CSS 스타일 학습에서는 목록 요소의 고급 기능을 광범위하게 사용합니다.
4.4.1 목록의 구조 구성
HTML 목록 요소는 목록 태그로 둘러싸인 구조이며 포함된 목록 항목은
으로 구성됩니다. 구체적인 구조는 그림 4.17에 나와 있습니다.
4.4.2 순서가 없는 목록 만들기
이름에서 알 수 있듯이 순서가 지정되지 않은 목록은 목록 구조의 목록 항목이 순서대로 나열되지 않은 목록입니다. 웹 애플리케이션의 목록은 대부분 순서가 지정되지 않은 목록을 사용하며, 목록 태그는 을 사용합니다.
- 목록 항목 1
- 목록 항목 2
- 목록 항목 3
- 목록 항목 4
- 목록 항목 5
4.4.3 정렬된 목록 만들기
이름에서 알 수 있듯이 순서가 있는 목록은 목록 구조의 목록 항목이 순서대로 나열된 목록입니다. 1, 2, 3 또는 a, b와 같이 위에서 아래로 다양한 일련 번호가 있을 수 있습니다. 씨 등 D:web 디렉터리에 웹 페이지 파일을 만들고 이름을 ul_ol.htm으로 지정한 다음 코드 4.17과 같이 코드를 작성합니다.
코드 4.17 목록 설정: ul_ol.htm
목록 설정
웹 프론트엔드 기술
웹 백엔드에 대해 알아보기
- ASP
- ASP.net
- PHP
- CGI
- 루비
- 파이썬
브라우저 주소창에 http://localhost/ul_ol.htm을 입력하면 그림 4.18과 같은 브라우징 효과가 나타납니다.
그림 4.18 목록 설정