[html] 取り消し線「s要素」とは? 使い方も解説!

s要素について知りたい人

s要素について知りたいな!

この記事は上記のような疑問を解消するものとなっています。

この記事でお話すること
  • 取り消し線「s要素」とは?
  • s要素の使い方

Webサイト制作を行っているときにセール前の価格を無効テキストとして表現したいと思ったことがありませんか?

そんなとき、s要素を利用します。

s要素はすでに正確ではなくなった、すでに関係なくなった内容を表すときに使用します。

そこでこの記事ではs要素について解説していきます。

よく使用する要素の一つなのでしっかりと理解して使い方をマスターしておきましょう!

気になる方は是非最後まで読んで頂ければと思います。

s要素の評価
頻出度
(5.0)
重要度
(5.0)
総合評価
(5.0)

1.取り消し線「s要素」とは?

s要素はすでに正確ではなくなった、すでに関係なくなった内容を表すときに使用します。

文書の編集を表す際に使用するのは適切ではありません。

削除されたテキスト箇所を表す場合には、s要素ではなく、del要素を使用してください。

ブラウザでは取り消し線が引かれたテキストとして表示されます。




2.s要素の使い方

それではs要素の使い方をみていきましょう。

以下は商品にセール前の価格を取り消して新しい特別価格が付けられたと表現したいときの使い方です。

<p>リンゴの価格</p>
<p><s>通常価格:50円</s></p>
<p>セール価格:30円</p>

上記のようにすることで「通常価格:50円」に取り消し線が引かれます。

取り消し線は間違った内容を明示したり、公開された情報を訂正したりする場合、あえて修正記録のテキストを残しておきたい場合にs要素が使われています。

よく使うのでしっかりと使い方をマスターしておきましょう!

 

HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方」はHTML5/CSS3を使ってモダンなサイトを制作するためのコーディングテクニックをハンズオン形式で学ぶ本です。

実践的な内容になっているので次のステップに進みたいという方は是非利用してみてはいかがでしょうか!?

 

HTMLやCSSを利用してWebサイト制作の副業に挑戦してみたいという方はいませんか!?

そんな方に「はじめての副業コース」をオススメします。

なんとHTMLやCSSを学べるだけでなく、案件紹介も行ってくれます!

Webサイト制作で稼ぎたいという方は是非「はじめての副業コース」を受講してみてはいかがでしょうか!?

コメントを残す

メールアドレスが公開されることはありません。