[html]

< div > 란,

Division의 약자로, 레이아웃을 나누는데 주로 쓰인다.
가상의 레이아웃을 설계하는데 쓰인다. (컨테이너라고 보면 됨!)
보통 css와 연동하여 스타일을 꾸미기에 적합하게 쓰인다.
*박스기능

< p > 란,

paragraph의 약자로, 하나의 문단을 만들 때 쓰인다.
문단 문단을 나눌 때 유용하게 쓰임! 마지막 문장이 종료되면 그 다음 단락과의 틈이 있음!
*문단기능

< span > 란,

span태그는 inline으로 주어진 데이터만큼만 공간을 가지는 태그이다.
다른 태그들은 줄 넘김이 있는 반면에 span태그는 줄넘김이 없어 옆에 연달아 작성된다.
*문장기능이라고 볼 수 있음

예시)

*각 태그들의 특성을 쉽게 알아볼 수 있게 임의로 css로 배경색을 주었다.
아직 여기까진 몰라도 됨!!

파란색배경이 div, 갈색배경이 p, 보라색배경이 span 이다.

위에 설명했던 것과 같이

div는 박스속성으로 div안에 있는 p,span을 감싸고 있는 모습을 볼 수 있다.

p는 본인 < p >< /p >가 종료된 후
다음 < p >가 시작될 때 사이에 간격이 생기는 것을 볼 수 있다.

span도 마찬가지로 첫< span >태그가 종료된 후 다음 < span >가 시작될 때 사이에 간격이 생긴다.
하지만 여기서 차이점은 < p >는 문단형식으로 되는 반면에
< span >는 문장형식인 것을 알 수 있다.

그럼 이쯤되면 div는 이해가 가지만, p와 span는 어떨 때 사용하는 지 궁금할 것이다!

예시를 보자!

보통 쓰는 사람 마음이지만, 나는 보기쉽게 p태그 안에 span태그를 넣어 문단내에 문장만 따로 스타일을 주고싶거나, 강조하고 싶을 때 사용하는 용도로 쓴다!

html을 사용함에 있어서 가장 기본중에 기본이라고 생각하는 태그들에 대해 가장 먼저 다뤄봤다.

문장만 보고는 이해가 안 갈수도 있으니, 직접 코드를 작성하여 홈페이지에 뜨는 것을 확인 해 보는 것을 추천한다!

그럼 다음페이지로 고고!=3