본문 바로가기
HTML

HTML5 Tag-Text [본문태그]

by Hrin_0820 2020. 7. 23.
    <h3>1. 단락(paragraph) 태그=문단을 나눈다. "p태그"</h3>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet rem, quibusdam error unde nostrum nisi. Autem fugit, consectetur magnam, magni laboriosam harum eligendi nesciunt odio perferendis, commodi assumenda. Sequi, minima!</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus incidunt non quaerat porro. Debitis assumenda alias velit ad ipsum cum, pariatur aperiam autem necessitatibus, unde, optio fugiat asperiores provident est.</p>

1. 단락(paragraph) 태그=문단을 나눈다. "p태그"

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet rem, quibusdam error unde nostrum nisi. Autem fugit, consectetur magnam, magni laboriosam harum eligendi nesciunt odio perferendis, commodi assumenda. Sequi, minima!

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus incidunt non quaerat porro. Debitis assumenda alias velit ad ipsum cum, pariatur aperiam autem necessitatibus, unde, optio fugiat asperiores provident est.


    <h3>2. 줄 바꾸는 태그 "br태그" (종료태그가 없음)</h3> 
    <p>This is <br> a para <br>graph with line breaks.</p> 

2. 줄 바꾸는 태그 "br태그" (종료태그가 없음)

This is
a para
graph with line breaks.


    <h3>3. 수평선 그리기(Horizontal Rules) 태그 "hr태그" (종료태그가 없음)</h3> 
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa inventore tempore, officiis numquam similique, aperiam eveniet quis, nobis corrupti, tempora id? Molestiae error accusantium sed voluptates repellat delectus optio beatae?</p> 
    <hr> 
    <p>Lorem ipsum hrdolor sit amet, consectetur adipisicing elit. Nisi nulla ea ad similique harum odio totam consequuntur dolorem corporis quasi porro, temporibus quisquam molestiae assumenda eius minus eum aperiam tempora!</p> 
     
     <!--    p태그 안에서 수평선 삽입, 즉 hr태그를 사용할 수 없다.--> 
     Lorem ipsum dolor sit amet, <hr>consectetur adipisicing elit. <hr>Mollitia hic itaque odio sed pariatur odit aspernatur laborum laudantium, distinctio sunt nesciunt eos in consequatur ea velit illum voluptatum, nostrum quod. 

3. 수평선 그리기(Horizontal Rules) 태그 "hr태그" (종료태그가 없음)

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa inventore tempore, officiis numquam similique, aperiam eveniet quis, nobis corrupti, tempora id? Molestiae error accusantium sed voluptates repellat delectus optio beatae?


Lorem ipsum hrdolor sit amet, consectetur adipisicing elit. Nisi nulla ea ad similique harum odio totam consequuntur dolorem corporis quasi porro, temporibus quisquam molestiae assumenda eius minus eum aperiam tempora!

Lorem ipsum dolor sit amet,
consectetur adipisicing elit.
Mollitia hic itaque odio sed pariatur odit aspernatur laborum laudantium, distinctio sunt nesciunt eos in consequatur ea velit illum voluptatum, nostrum quod.

 

     <h4>4. hr태그의 속성값(스타일)</h4> 
    <hr> 
    <hr size="5" width="400px" align="right"> 
    <hr size="7" noshade>  <!--noshade는 수평선을 평면적으로 나타냄.--> 
    <hr size="5" width="90%" align="center" color="yellow"> 

    <!--        size=굵기, width=길이(픽셀or%), align=정렬, color=색상-->

출력이미지

    <h3>5. 긴 인용문 블럭 지정 태그(들여쓰기 효과) "blockquote태그"</h3> 
    <p>브라우저는 일반적으로 blockquote 요소를 들여쓰기 한다.</p> 
        <blockquote> 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit vel laborum delectus amet, sunt officia ducimus. Atque voluptatibus quibusdam ex modi sunt, dolores quasi, dolorum tempora magni sapiente obcaecati quidem.</p> 
        </blockquote>

5. 긴 인용문 블럭 지정 태그(들여쓰기 효과) "blockquote태그"

브라우저는 일반적으로 blockquote 요소를 들여쓰기 한다.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit vel laborum delectus amet, sunt officia ducimus. Atque voluptatibus quibusdam ex modi sunt, dolores quasi, dolorum tempora magni sapiente obcaecati quidem.

 

brackets 소스

댓글