s 태그는 취소선을 표현할 때 설정합니다.

s 태그는 취소선을 표현할 때 설정합니다.

Reference/HTML

s 태그는 취소선을 표현할 때 설정합니다.

by @webs 2022. 12. 29.

<s>

<s> 태그는 취소선을 표현할 때 설정합니다. 더 이상 텍스트와 관련이 없거나 적절하지 않은 것을 나타낼 때 사용합니다. 문서 편집을 위한 텍스트 수정은 <del> 또는 <ins> 태그를 사용합니다.

---

특징	설명
요소	인라인 요소(Inline Element)
닫는 태그	적용(<s>~</s>)
버전	HTML4
시각적 표현	가운데 줄 표시
사용성	★☆☆☆☆

정의(Definition)

• <s> 태그는 취소선을 표현할 때 설정합니다.
• <s> 태그는 텍스트가 정확하지 않고, 관련성이 없는 내용을 표시하는데 사용합니다.
• <s> 태그는 주로 할인된 가격에 표시합니다.
• <s> 태그는 시각적으로 가운데 줄이 표시됩니다. 단순하게 취소선을 설정하고 싶다면 text-decoration: line-through;을 통하여 설정할 수 있습니다.

접근성(Accessibility)

• <s> 태그는 화면 판독기를 통해 판별할 수 없기 때문에 가상요소(::before, ::after)를 이용하여 시작과 끝을 알려주어야 합니다. 일부 화면 판독기 사용자는 이 기능을 불편해 하기 때문에 이 내용을 알지 못하면 불편한 경우에만 사용하는 것을 추천합니다.

관련된 태그(Related Tags)

• <ins> 태그는 추가된 텍스트의 범위를 표현할 때 설정합니다.
• <del> 태그는 삭제된 텍스트의 범위를 표현할 때 설정합니다.
• <s> 태그는 취소선을 표현할 때 설정합니다.

예제1(Sample)

텍스트와 관련된 예제입니다.

• <ins> 태그는 추가된 텍스트의 범위를 표현할 때 설정합니다.
• <del> 태그는 삭제된 텍스트의 범위를 표현할 때 설정합니다.
• <s> 태그는 취소선을 표현할 때 설정합니다.

HTML

CSS

SCRIPT

<ul>    
    <li><ins>ins 태그는 추가된 텍스트의 범위를 표현할 때 설정합니다.</ins></li>
    <li><del>del 태그는 삭제된 텍스트의 범위를 표현할 때 설정합니다.</del></li>
    <li><s>s 태그는 취소선을 표현할 때 설정합니다.</s></li>
</ul>

.sampleView a,
.sampleView code,
.sampleView var,
.sampleView samp,
.sampleView kbd {
    color: #FF4B4C;
    border-bottom: 1px solid #FF4B4C;
}

//Javascript none

호환성(Compatibility)

						6	7	8	9	10	11
<s>	○	○	○	○	○	○	○	○	○	○	○	○	○	○

텍스트와 관련된 태그

• <b> 태그는 중요성을 전달하지 않고, 주의를 끌기 위한 용도로 사용할 때 설정합니다.
• <em> 태그는 텍스트를 강조할 때 설정합니다.
• <strong> 태그는 텍스트를 강조하거나 의미의 중요성을 강조할 때 설정합니다.
• <mark> 태그는 중요성과 강조를 고려하지 않는 단순 참고용 표시를 할 때 설정합니다.
• <i> 태그는 특별한 이유로 평범한 글자와 구분할 때 설정합니다.
• <abbr> 태그는 줄임말이나 머리글자를 표현할 때 사용합니다.
• <dfn> 태그는 용어를 정의할 때 설정합니다.
• <small> 태그는 덧붙이는 글이나 작은 글씨를 표현할 때 설정합니다.
• <u> 태그는 맞춤법이 틀린 단어를 표현할 때 설정합니다.
• <cite> 태그는 저작물의 출처 표시를 할 때 설정합니다.
• <q> 태그는 태그는 짧은 글을 인용할 때 설정합니다.
• <blockquote> 태그는 태그는 긴 글을 인용할 때 설정합니다.
• <sub> 태그는 아래첨자를 표현할 때 설정합니다.
• <sup> 태그는 위첨자를 표현할 때 설정합니다.
• <ins> 태그는 추가된 텍스트의 범위를 표현할 때 설정합니다.
• <del> 태그는 삭제된 텍스트의 범위를 표현할 때 설정합니다.
• <s> 태그는 취소선을 표현할 때 설정합니다.
• <code> 태그는 소스 코드를 표현할 때 설정합니다.
• <var> 태그는 수학적인 변수나 프로그램의 변수를 표현할 때 설정합니다.
• <samp> 태그는 프로그램 출력 결과물을 표현할 때 설정합니다.
• <kbd> 태그는 키보드 입력요소를 표현할 때 설정합니다.

참고(Reference)

• https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-s-element

---