본문 바로가기

프로그래머/HTML

HTML 문법(부모-자식 parent-child 태그) | 생활코딩 강의 복습 | 프로그래밍 공부

* 이 포스팅은 생활코딩 강의를 들으며 내용을 정리한 것이며, 

모든 내용은 https://opentutorials.org/ 에서 보실 수 있습니다.*


내용에 목차를 추가해보자.



목차를 입력하고, 줄 바꿈 태그 <br>으로 목차를 완성해보자.



이렇게 나온다.

그러면, 원래 줄 바꿈 기능할 하는 태그 대신, 목록의 의미를 나타내는 태그 <li>를 써보자.



쓰고자 하는 목록을 <li>로 감싸주면 된다.



이렇게 <br> 태그를 쓰지 않더라도 자동으로 한 줄이 띄어진다.



목록을 추가해보자.



결과를 보면, 상관성이 없는 목차들인데, 

붙어있으니까 보기가 좋지 않다.


<ul> 태그로 감싸주자.

ul은 unordered list의 약자이다.

코드를 보면, <ul> 안에 <li>가 있는 것을 볼 수 있다.

<li>와 같은 항목들을 어디서부터 어디까지 연관이 있는 항목인지를 구분하는 태그가 <ul>과 같은 부모태그이다.


따라서 <li> 태그는 반드시 부모태그를 필요로 하고, <ul> 태그도 반드시 자식태그를 필요로 한다.



상관성이 있는 목차들끼리

붙어있는게 보기가 좋다.



목차가 한 두개가 아닌, 1억개라면???

일일이 번호를 붙이기 곤란하다.

그럴 때 쓰는 태그가 ordered list, <ol> 태그이다.




자동으로 번호가 붙어서 나온다.