HTMl_태그란 무엇인가?

박눌찡·2023년 2월 1일
0

HTML&CSS

목록 보기
1/2

자바스크립트를 공부한지 3개월이 되어간다.
이제 프론트앤드 개발자가 알아야할 HTML과 CSS공부를 시작했다.
오늘은 간단한 HTML태그들을 정리해보고 예제들을 살펴보려 한다.

TAG란 무엇인가?

태그는 열리는태그와 닫히는 태그로 구분된다.
열린태그와 닫힌태그의 구분은 / 로 할 수 있다.

먼저 text를 적어준다.

Hypertext Markup Language is the standard markup 
language for creating web and web applications. 

강조, 및줄을 그어줄 때 사용하는 HTML코드를 알아보자.

<strong></strong> - 글자 진하게 
<u></u> - 밑줄 
Hypertext Markup Language is the standard markup 
language for <strong>creating <u>web</u></strong> and web applications. 

이렇게 태그를 사용하면 웹에선 어떻게 뜰까?

태그가 적용된걸 볼 수 있다.

여기에 제목을 설정해줄 수 있다.

<h1>HTML</h1>Hypertext Markup Language is the standard markup 
language for <strong>creating <u>web</u></strong> and web applicati

줄바꿈 태그

<br> vs <p>

가장 많이 쓰이는 태그 중 하나입니다. 이 두 태그는 서로 경쟁관계에 있다고 해도 무방합니다.

만약 위에 예제 글이 더 길어질 경우 어떻게 문단을 정리해야할까요?
바로 줄바꿈 태그로 정리를 해주어야 합니다.

줄을 바꾸고 싶을 때는 br태그를 사용하면 됩니다.
문단을 나눌 때도 br태그를 연속으로 사용하게 되면 훨씬
가독성을 높여줄 수 있습니다.

br태그는 닫힘 태그가 없이 홀로 동작합니다.

다음은 p태그 입니다. p는 paragraph의 약자입니다. 뜻은 '단락'입니다.
br태그 만큼이나 P태그도 굉장히 많이 쓰이는 태그 중 하나입니다.

p태그와 br태그의 큰 차이점은, p태그는 정해진 여뱅만큼 벌어지기 떄문에 시각적으로 자유도가 떨어집니다.
반면에, br태그는 줄바꿈을 좀 더 많이 하고 싶을 떄 여러번 사용할 수 있습니다.

하지만 P태그에 css를 적용 한다면 동일한 적용을 할 수 있습니다.

<p style="margin-top:40px">

로 변경하면 해당 p태그 상단에 여백이 40Px만큼 생깁니다.

실로 P태그는 br태그보다 더 유용히 사용되는 인기있는 태그 중 하나입니다.

profile
개발자 성장 과정 기록

0개의 댓글