어제 오늘 내일

[HTML] 취소선, 밑줄 그리기 본문

IT/HTML&CSS

[HTML] 취소선, 밑줄 그리기

hi.anna 2017. 8. 17. 09:21



HTML에서 취소선, 밑줄 그리기






HTML에서 글자에 취소선과 밑줄을 그리는 방법을 알아보도록 하겠다.



취소선 표현하기 <del>

See the Pen html example by anna (@hianna) on CodePen.

<del>태그는 'delete'의 약자이다.

글자에 취소선을 표현하기 위해서는 

<del> 태그 사이에 취소선을 그을 글자를 넣어주면 된다.



밑줄 표현하기 <ins>

See the Pen html example by anna (@hianna) on CodePen.

<ins> 태그는 'insert'의 약자이다.

밑줄을 표현하기 위해서는

위와 같이 <ins> 태그 사이에 밑줄을 그을 글자를 넣어주면 된다.



<del> <ins>라는 태그명을 가졌을까?

<del>태그와 <ins>태그는 원래 문서의 변경사항을 표현하기 위한 태그이다.

문서가 변경되어 삭제된 내용에는 <del> 태그를,

문서가 변경되어 추가된 내용에는 <ins> 태그를 사용한다.

이렇게 표시하면, 

글을 보는 사람들은 '아 글의 내용이 변경되었구나!' 하는 것을 인지할 수 있게 된다.

태그명이 underline이나 cancel이 아닌

delete와 insert의 약자인 이유가 이것이다.

하지만, 보통은 단순히 텍스트의 밑줄이나 취소선을 나타내는

시각적인 효과를 위해 사용되고 있긴 하지만 말이다.



반응형
Comments