우리는 지난 21th 블로그에서 웹페이지에 표시되는 글꼴에 사용되는 다양한 태그들중 2번쨰로 <b> 태그와 <strong>에 대하여 공부하였습니다.
이번 22th 블로그에서는 웹페이지에 표시되는 글꼴에 사용되는 아래의 다양한 태그들중 3번쨰로 텍스트에 밑줄을 그어주는 <ins> 태그와 <u>태그에 대하여 소개하고자 합니다.
01) <i>태그와 <em> 태그
02) <b> 태그와 <strong> 태그
03) <ins> 태그와 <u> 태그
04) <del> 태그와 <s>태그
05) <sup> 태그와 <sub>태그
06) <small>태그와 <big> 태그
---------- ----------
1. <ins> 태그와 <u> 태그란 무엇인가?
<u>태그는 단순히 밑줄을 긋고 싶을 때 사용하고 <ins>x태그는 새로 추가된 내용을 의미할 때 사용하는 태그입니다.
1) <ins> 태그
html에서 사용되는 <ins> 태그는 insert라는 영어단어의 앞글자 3개에서 따온 태그로, 웹페이지의 새로 추가된 텍스트에 밑줄을 표시하는 경우에 사용하는 태그입니다.
2) <u>태그
html에서 사용되는 <u> 태그는 underline이라는 영어단어의 앞글자 1개에서 따온 태그로, 웹페이지의 텍스트에 단순히 밑줄을 표시하는 경우에 사용하는 태그입니다.
2. <ins> 태그와 <u> 태그 구문
<ins>태그와 <u> 태그 둘다 텍스트에 밑줄을 표시하는 태그로, <opening> 태그와 <closing> 태그로 구성됩니다. <opening> 태그와 <closing> 태그 사이에 Text를 넣으면 텍스트에 밑줄이 표시됩니다.
1) <ins> : <ins>Text </<ins>
2) <u> 태그 : <u>Text </<u>
3. <ins> 태그와 <u> 태그 의 차이
웹브라우저로 보면 둘다 밑줄이 그어져 있기 때문에 같아 보이지만, <ins>태그는 datetime 속성값을 이용하여 내용의 추가와 삭제가 언제 이루어졌는지를 의미적으로 지정할 수 있는 반면에 <u>태그는 단순히 밑줄만을 표시한 경우입니다.
<ins> 태그로 감싼 부분은 밑줄이 표시됩니다. datetime 속성값은 눈에 보이지 않지만 의미적으로 그 시점에서 내용의 추가와 삭제가 이루어졌음을 나타내게 됩니다.
참고로 datetime 속성에 들어갈 값은 <time> 태그와 같은 형식입니다. 다만 특정 기간이 아닌 ‘특정 시점’으로 지정해야 한다는 차이가 있습니다
4. <ins> and <u> tags coding example
01) 코딩
02) 웹페이지
