[HTML] 정형화된 텍스트

2023. 3. 7. 01:26기술 창고/HTML

728x90
SMALL
<!DOCTYPE html>
<html lang="ko">
    <head> 
        <meta charset="utf-8"> 
        <title>정형화된 텍스트</title> 
    </head>
    <body> 
        <h1>정형화된 텍스트</h1>
        <p>
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Cupiditate fugiat beatae facere eos labore error dolorum non, corrupti odit ipsum maiores quos exercitationem repellendus delectus repellat quas pariatur vero impedit?
        </p>
        <pre>
            Lorem ipsum dolor, sit a
            
            met consectetur adipisicing elit. Cupiditate fugiat beatae facere eos labore error dolorum non, corrupti odit ipsum maiores quos exercitationem repellendus delectus repellat quas pariatur vero impedit?
        </pre>
        <pre>
            <code>
                &lt;script&gt;
                
                &lt;/script&gt;
            </code>
        </pre>
    </body>
</html>

<!--
    # 태그 안에있는 텍스트를 아무리 개행을 해봣자 출력결과는 변함이 없다.

    # <pre> = pre 태그 안에 있는 텍스트에 변화를 주면 그대로 출력되는 태그.

    # <code> = 작성한 코드를 화면에 직접 보여주고 싶을 때 사용하는 태그
                하지만 <> 태그 기호를 그대로 사용하면 나오지 않기 때문에 앞서 entity 코드를 사용하여
                <> 기호를 그대로 출력되게 한다. (&lt; &gt;)
                또한, pre 태그 처럼 code 태그 안의 텍스트 내용에 개행을 주거나 변경점을 주면
                그대로 반영되어 나온다.
-->
  • <pre> : pre 태그 안에 적은 텍스트는 변경을 준 내용 그대로 출력된다.
  • <code> : 작성한 코드를 화면에 직접 보여주고 싶을 때 사용하는 태그. <, > 기호들을 사용하게 되면 태그로 인식되기 때문에 <, > 기호를 그대로 작성하면 안되고 &lt; &gt 와 같은 entity 코드를 사용하여 해당 기호들을 사용한다.

 

# entity 코드 참고 사이트 : https://entitycode.com/

 

Entity Code - A Clear and Quick Reference to HTML Entities Codes

About EntityCode The idea came from my constant need to add those hard to remember HTML entity codes, such as the copyright symbol ( © ), every time I’m developing a new website or writing a new article. Usually, I either open one of my previously done

entitycode.com

 

 

# 작성한 코드가 표준에 맞게 작성되었는지 확인 가능한 사이트 : https://validator.w3.org/

 

The W3C Markup Validation Service

Validate by File Upload Note: file upload may not work with Internet Explorer on some versions of Windows XP Service Pack 2, see our information page on the W3C QA Website.

validator.w3.org

 

 

# 실행한 결과

 

728x90
반응형
LIST

'기술 창고 > HTML' 카테고리의 다른 글

[HTML] list 목록 태그  (0) 2023.03.07
Visual Code 설치와 초기 html 작성  (0) 2023.03.07
[HTML] 시멘틱 (semantic) 구분  (0) 2023.03.07
[HTML] paragraph 텍스트  (0) 2023.03.07
[HTML] Heading 태그  (0) 2023.03.07