HTML 글 단락 P태그와 줄바꿈 br 태그 사용법
지난 시간에는 HTML의 기본 구조와 태그에 대해서 간략하게 알아봤습니다. 여기까지는 무척이나 쉽습니다. 그러나 기초가 가장 중요하다고 생각합니다. 그러니 쉽다고 안일하게 생각할 것이 아니라 이 기초를 활용하여 여러가지로 응용할 수 있을 것 이라고 기대하고 있습니다. 선생님께서도 기초가 진짜 중요하다고 신신당부를 하시네요.
이번 시간에는 문단을 구성하는 <P> 태그와 줄바꿈하는 <br> 태그의 쓰임새를 알아보겠습니다. 참고로 P는 패러그래프의 약자로 단락을 의미하며, BR은 라인브레이크의 약자입니다. (왜 RB가 아니고 BR일까...?) 또한 <br> 태그는 마무리태그가 없이 단독으로서 사용이 가능합니다. 참고하시기 바랍니다.
어제에 이어서 오늘은 본문을 구성해 보았습니다. 진달래꽃 시를 그대로 텍스트로 넣었습니다. <body> 태그 안에 글을 작성했구요, 한글 프로그램에서는 보시는 그대로 출력이 되겠지만, HTML 문서상에서는 이렇게만 작성하면 어떻게 출력되는지 한번 확인해 보겠습니다.
보시는 것 처럼 그대로 한줄로 쭉 이어서 출력됩니다. 우리가 편집화면에서 보는 것과 실제 적용되는 텍스트의 차이가 어떤지 알 수 있습니다. 이제 <P> 태그를 한번 넣어서 어떤 변화가 있는지 살펴보겠습니다.
나 보기가~보내 드리오리다. 까지 <P>로 감싸보겠습니다.
출력되는 텍스트를 보니 이런 차이가 있음을 알 수 있습니다. 그러면 각 단락별로 한번 모두 적용시켜 보겠습니다.
적용은 이렇게 하면 되겠죠?
조금씩 시 다워집니다. 이제 줄바꿈 태그인 <br> 을 사용해 보겠습니다.
이렇게 적절하게 배치를 하도록 합니다. 아까 말씀드렸듯 이 태그는 단독 사용을 합니다. 슬레쉬로 마무리 하지 않습니다.
이렇게 하니 이제서야 시 다워졌습니다.
<p> 태그와 <br> 태그의 차이점은, <p>를 여러번 연속으로 사용한다고해서 간격이 벌어지는것이 아니라는 것 입니다. 여러칸 줄바꿈을 하기 위해서는 <br>태그를 여러번 사용하면 됩니다. 사용된만큼 차이가 벌어집니다. 이렇게 3개를 넣어보면 어떨까요?
보시는 것 처럼 3번 엔터를 누른 효과처럼 출력됩니다.
이제 글 단락을 변경하는 <p> 태그와 줄바꿈을 하는 <br> 태그의 사용법을 알아봤습니다. 어렵지 않게 따라하실 수 있으실 겁니다. 기초가 중요합니다. 쉬운만큼 까먹기 쉬우므로 자주 연습해 봅시다. 연습하는만큼 기초는 탄탄해 질 것입니다. 끝.
"친절한효자손 취미생활" 을 검색!
