티스토리 뷰

HTML

HTML 번역 07: HTML 문단(paragraphs)

rewriter751 2016. 2. 23. 01:14

HTML Tutorial

  • HTML 문서는 문단으로 나눈다.

HTML 문단

    1. HTML <p> 요소는 문단을 정의한다.  
        - 예  
              <p>This is a paragraph</p>  
              <p>This is another paragraph</p>  
        - 팁: 브라우저는 문단의 위아래에 약간의 흰 공백을 자동적으로 추가한다.

HTML 표시

    1. 당신은 HTML이 화면에 어떻게 보이질 정확히 알 수 없다.  
    2. 크거나 작은 화면, 그리고 크기가 바뀐 창들은 다른 결과를 낳을 것이다.  
    3. 당신이 HTML 코드 안에서 여분의 공백이나 줄을 추가하는 것으로서는 결과물을 바꿀 수 없다.  
    4. 웹브라우저는 웹페이지를 화면에 보일 때 여분의 공백이나 줄을 제거해 버릴 것이다.  
    5. 아무리 많은 공백이나 줄이라고 하더라도 그저 하나의 공백으로 간주된다.  
        - 예  
              <p>  
              This paragraph  
              contains a lot of lines  
              in the source code,  
              but the browser  
              ignores it.  
              </p>

              <p>  
              This paragraph  
              contains         a lot of spaces  
              in the source         code,  
              but the        browser  
              ignores it.  
              </p>  
    6. 끝-태그를 잊지 마라  
    7. 많은 브라우저는 비록 당신이 끝-태그를 잊었다고 하더라고 HTML 문서를 정확하게 표시할 것이다.  
        - 예  
              <p>This is a paragraph  
              <p>This is another paragraph  
    8. 위의 예는 대부분의 브라우저에서 잘 작동하지만 그것에 의존하지는 마라.  
    9. 끝-태그를 잊는 것은은 예상하지 못한 결과나 오류를 낼 수 있다.  
    팁:  XHTML과 같은 엄격한 버전의 HTML은 끝-태그를 잊어서는 안 된다.

HTML 강제 줄 바꿈

    1. HTML <br> 태그는 줄 바꿈을 정의한다.  
    2. 새로운 문단의 시작 없이 강제로 줄 바꿈(새로운 줄로 이동)을 하고자 한다면 <br>을 쓰라.  
        - 예  
              <p>This is<br>a para<br>graph with line breaks</p>  
    3. <br> 요소는 빈 HTML 요소이다. 즉 끝-태그가 없다.

운문 문제

    1. 아래의 시는 단 한 줄로 표시될 것이다.  
        - 예  
              <p>
                My Bonnie lies over the ocean.

                My Bonnie lies over the sea.

                My Bonnie lies over the ocean.

                Oh, bring back my Bonnie to me.  
              </p>

HTML <pre> 요소

    1. HTML <pre> 요소는 선-서식(preformatted) 텍스트를 정의한다.  
    2. <pre> 요소 안의 텍스트는 고정 너비 글꼴(보통 Courier)로 보여지며, 공백과 줄바꿈 모두 보존하다.  
        - 예  
              <pre>
                My Bonnie lies over the ocean.

                My Bonnie lies over the sea.

                My Bonnie lies over the ocean.

                Oh, bring back my Bonnie to me.  
              </pre>

HTML 태그 레퍼런스

    1. W3Schools의 태그 레퍼런스는 HTML 요소와 그에 딸린 속성에 대한 추가 정보를 포함한다.  
        - Tag   Description  
          <p>   단락을 정의한다.  
          <br>  강제 줄바꿈을 삽입한다.  
          <pre> 선-서식 텍스트를 정의한다.
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2025/07   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
글 보관함