html안에서 아무리 Enter를 치거나 스페이스를 하여 공백을 표시한다고해서 브라우저에 Enter나 공백이 나오지는 않습니다. 그래서 우리는 Enter는 <br>태그를 사용함으로써 구현하고 공백은   라는 문구를 삽입해 공백을 표현하고는 합니다. 하지만 이렇게 일일이 여러 태그를 활용하여 개행이나 공백을 넣지않아도 되는 방법이 있습니다. 바로 <pre>태그인데요. 0<pre>태그를 활용하면 <pre>태그안에서는 Enter나 Tab, Space를 다 활용할 수 있기때문에 긴 문장등을 표현할때 굉장히 효율적으로 사용할 수 있습니다.
예제
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
동해물과 백두산이 마르고닳도록
하느님이 보우하사 길이 보우하세
무궁화 삼천리 화려강산
대한사람 대한으로 길이보전하세
</body>
</html>
만약 pre태그를 활용하지않고 이렇게 애국가를 치게 되면 Enter가 먹히지 않습니다. Html에서 Enter를 표현하는 <br>태그를 사용하지 않았기 때문이죠. 위 코드의 결과는 아래와 같습니다.
하지만 이렇게 장문의 문장을 개행할때마다 <br>태그를 해주는것은 굉장히 비효율적입니다. 하지만 문단의 아래 위에 <pre>태그를 활용해주면 일일이 <br>태그를 삽입해주지 않아도 개행효과를 낼 수 있습니다.
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<pre>
동해물과 백두산이 마르고닳도록
하느님이 보우하사 길이 보우하세
무궁화 삼천리 화려강산
대한사람 대한으로 길이보전하세
</pre>
</body>
</html>
'태그및 css' 카테고리의 다른 글
| HR태그 (0) | 2019.02.15 |
|---|---|
| MarQuee (0) | 2019.02.15 |
| <span>태그 (0) | 2019.02.15 |
| 문단을 나누는 P태그 (0) | 2019.02.15 |
| UI 태그, OL태그, DI태그, LI태그 (0) | 2019.02.15 |