1.3 문법에 맞춰 글을 쓰기 위한 태그입니다.
늦잠을 자버렸답니다. 전 잠이 너무 많아서 정말 큰일이랍니다. 손톱을 물어뜯는 버릇은 고쳤는데, 늦잠자는 버릇은 아직 못고쳤지 뭐예요. 어서 고쳐야겠어요. HTML 문서를 작성할 때 분명히 줄을 바꿔서 썼었는데, 줄바꿔쓰기가 되어있지 않은채로 표현되어져서 당황했던 초보분들 아마 계셨을 거예요. 저도 처음에 그랬었거든요. 자, 지금부터 그 방법에 대해서 알아보도록 하겠습니다.
1.3.1 줄바꿔쓰기와 띄어쓰기
문법에 맞춰 글을 쓰기 위한 태그란 HTML 문서내에서는 일반 문서편집기에서와 같은 줄바꿔쓰기와 띄어쓰기가 적용되지가 않는답니다. 작성할 때, 줄을 바꿨다거나 띄웠다고 해도 브라우저 상에서는 한 줄로 표시됩니다. 다시말해서 Enter키와 Space바가 적용되지 않는다는 말이죠. 그와 같은 기능을 하는 태그들을 써줘야 합니다. 오늘 배울 내용이 이러한 것이예요. 줄바꿔쓰기, 띄어쓰기, 문단나누기, 문단정렬 등이랍니다.
[줄바꿔쓰기]
<br>: 한 줄을 바꿔줄 수 있게하는 태그입니다. |
|
<html>
<body>
이 곳에 줄바꿔쓰기 전의 글자를 입력하시면 됩니다.<br>
이 곳에 줄바꿔쓴 후의 글자를 입력하시면 됩니다.
</body>
</html> |
한 줄을 띄우고 다음 글을 입력하고 싶으시면 <br>을 두번 입력하시면 되구요, 두 줄을 띄우고 다음 글을 입력하고 싶으시면 세번 입력하시면 됩니다. 띄우고 싶은 줄의 수+1만큼 입력하시면 되겠습니다. 자주 사용되어지는 태그이니만큼 꼭 외워두셔야 합니다. 예제를 보시면서 줄바꿔쓰기에 대해서 정리를 하도록 하고, 띄어쓰기로 넘어가도록 합시다.
예제 1
줄바꿔쓰기
<html>
<body>
첫번째 줄 입니다.<br>
두번째 줄 입니다.<br>
세번째 줄 입니다.<br><br>
한 줄을 띄우고 다음글이 입력되었죠?<br><br><br>
두 줄을 띄우고 다음글이 입력되었죠?<br><br><br><br>
세 줄을 띄우고 다음글이 입력되었죠?
</body>
</html> |
태그연습장을 사용하여 예제 1의 결과를 확인해 보세요.
지금 '줄바꿔쓰기는 안되지만 띄어쓰기는 되던데요?'라고 생각하시는 분들 분명히 계실거예요. 간혹 안되는 경우들이 더러 있답니다. 그럴 때를 대비하여 꼭 외워두셔야 합니다. 원래 줄바꿔쓰기와 띄어쓰기 태그도 '1.2.3 글꼴, 첨자, 밑줄'에서 몇 줄 정도로 간략히 소개하고 넘어갈 수도 있었지만, 그렇게 해놓으면 여러분께서 그냥 지나치시게 될 것 같아서 이렇게 따로 빼놓은 것이랍니다. 제가 이렇게까지 강조했는데 설마 안외우고 그냥 넘어가시는 분은 없겠죠?
[띄어쓰기]
: 한 칸을 띄워줄 수 있게하는 태그입니다. |
|
<html>
<body>
이 곳에 띄어쓰기 전의 글자를 입력하시면 됩니다.
이 곳에 띄어쓴 후의 글자를 입력하시면 됩니다.
</body>
</html> |
한 칸을 띄우고 다음 단어를 입력하고 싶으시면 를 한번 입력하시면 되구요, 두 칸을 띄우고 다음 단어를 입력하고 싶으시면 두번 입력하시면 됩니다. 띄우고 싶은 칸의 수만큼 입력하시면 되겠습니다. 제가 외운 방법으로 외우신다면 외우기가 그렇게 어렵지는 않을 것 같은데요. 제 방법은 를 '엥, 우유네?'로 외우는 것입니다. 를 한글로 입력하면 &ㅜㅠ네;가 되잖아요^-^?
예제 2
띄어쓰기
<html>
<body>
&nbsp;는 한 칸을 띄워줄 수 있게하는 태그입니다.<br>
앞에서 한 칸을 띄워보겠습니다.<br>
앞에서 두 칸을 띄워보겠습니다.<br>
앞에서 세 칸을 띄워보겠습니다.
</body>
</html> |
태그연습장을 사용하여 예제 2의 결과를 확인해 보세요.
모든 HTML 태그는 <로 시작해서 >로 끝난다고 했는데, 띄어쓰기 태그를 보시고 '저것도 HTML 태그야?'라고 생각하시는 분들 계셨을 거예요. 네, 맞습니다. HTML 태그랍니다. 띄어쓰기를 하거나 특수문자를 입력할 경우에 이와 같은 형태의 HTML 태그를 사용하게 된답니다. 특수문자를 입력하는 방법에 대해서는 'HTML 중급교실'에서 다루기로 하고, 문단나누기와 문단정렬하기로 넘어가도록 하겠습니다.
|