본문 바로가기

HTML , CSS

HTML 텍스트 관련 요소(Element) 과 <table> 요소(Element)

★html 실습 하면서 추가적으로 다룬 텍스트 관련 속성을 정리해보려 합니다~

 

 

목차 

  • 텍스트(Text) 관련 요소(Element)
  • <table></table> 요소(Element)

 

▶ 텍스트(Text) 관련 요소(Element)

 

<br />

△ 인라인 요소로  줄바꿈을 해주는 엘리먼트 .

 

 

<del> 콘텐츠 </del>

△ 인라인 요소이며 delete 의 약자. 삭제된 내용을 나타내는 엘리먼트 / 콘텐츠 가운데 줄이 표시됨.

 

 

<ins>콘텐츠</ins>

△ 인라인 요소이며 insert의 약자. 입력된 내용을 나타내는 엘리먼트 / 콘텐츠 밑에 줄이 표시됨. 

 

 

<i>콘텐츠</i>
<em>콘텐츠</em>

△ 인라인 요소이며 글씨를 기울임. 

- <i> 는 이름이나 명칭, 인용구를 나타날 때 주로 사용.

-<em>은 강조할때 사용

 

a<sub>b</sub>
a<sup>b</sup>

인라인 요소이며 아래와 같이 표시되며 수학적 설명이나 단어의 부과 설명을 할 때 사용됨.

 

 

<hr />

△ 인라인 요소로  수평선을 그어주는 엘리먼트.

 

 


 

▶<table></table> 요소(Element) 

 

<table>
        <thead>
          <tr>
            <th>번호</th>
            <th>이름</th>
            <th>성별</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th>1</th>
            <td>아무개-1</td>
            <td>여자</td>
          </tr>
          <tr>
            <th>2</th>
            <td>아무개-2</td>
            <td>남자</td>
          </tr>
        </tbody>
</table>

△ 아래 그림 처럼 페이지 상에서 표형식 처럼 각 위치마다 구분되어 보여주는 엘리먼트 

 

- html 형식과 비슷한 구조를 가지고 있으며 각 위치마다 적용되는 자식엘리먼트를 가지고 있다.

-<table> 의 자식으로는 <thead> , <tbody>  가진다. 

- <thead> ,<tbody> 의 자식으로는 <tr> 을 가진다.

-<tr>의 자식으로는 <th> 와 <td> 가있다.