[HTML] Grouping Content

ul

순서가 없는 목록을 나타낼때 사용한다.

ol

순서가 있는목록

<ol type="I">
	<li>one</li>
	<li>two</li>
	<li>three</li>
</ol>
<P>type: a, A, i, I</P>

👌ul,ol의 자식요소는 무조건 <li>

hr

이야기에서 장면 전환, 문단 안에서 주제가 변경되었을 때 그 구별을 위해 사용한다.
<p>내에서 사용 금지.

dl, dt, dd

<dl>사전처럼 어떠한 것을 정의할 때 쓰이는 목록.

👌ul,ol의 자식요소는 무조건 <dt>, <dd>

dt 태그는 용어의 정의
dd 태그는 용어의 설명

<dl>
  <dt>필라프</dt>
  <dd>필라프는 쌀이나 으깬 밀과 같은 곡식으로 만드는 음식입니다.</dd>  ->들여쓰기가 되어서 출력된다
<dl>

div

대용할 태그가 없을때 사용한다. Block요소를 갖고있다.

span

span도 최후의 수단으로 사용하자. inline요소를 갖고있다.

p

paragraph 단락이라는 의미(내용상으로 매듭을 짓는 단, 문장으로 사용한다)
p태그를 연속적으로 사용하면 단락과 단락이 떨어져 스타일되면서 나온다
1.웹브라우저의 가로 한 줄을 사용하는 태그 (유동적으로 줄바꿈이 된다)
2.공백은 웹 브라우저에서 최대 한칸이다

올바르지 않는 사용법 
<p>오늘 민수는 핫도그를 먹고</p>
<p>피자를 먹고 밥을 먹었다.</p> ->두개의 내용이 끊어지는 코딩은 바람직하지 않다

올바른 방법
<p>오늘 민수는 핫도그를 먹고<br>피자를 먹고 밥을 먹었다.</p> 

pre

HTML에 작성한 내용 그대로 화면에 표현한다.

figure, figcaption

이미지와 캡션

<figure>
	<img src="images/baby.jpg" alt="아기 코끼리">
	<figcaption>
		관심 받고싶어하는 아기
	</figcaption>
</figure>

main

blockquote

👀특수문자 태그 참고 사이트

https://www.toptal.com/designers/htmlarrows/
https://dev.w3.org/html5/html-author/charref

좋은 웹페이지 즐겨찾기