s要素

TOPページに戻る > html入門

スポンサード リンク

s要素

文字に取り消し線を表示します
s要素は古いブラウザ互換のために残されている推奨されない要素なのでdel要素を使うかcssのtext-decorationプロパティを使いましょう

使い方(書式)

<s></s>

s要素

対応ブラウザ ie6 ie7 ie8 ie9 ie10 ie11 google Chrome safari fire fox opera
要素の種類 インライン要素
内容となる要素 インライン要素、テキスト

属性 説明
共通属性 html共通属性
イベント属性 htmlイベント属性

実際の指定方法

html

<s>テキスト</s>

実際の表示

テキスト

cssでスタイルを指定

html

クラス名は自由に変えてください。hogeがclass名です
<s class="hoge">テキスト</s>

css

.hoge{ color: #FF6600; }        /* 文字色をオレンジに指定 */
.hoge2 { font-weight: bold; } /* 文字の太さを太くする */
.hoge3 { border: solid 1px #FF9900; } /* 枠線を表示 */
.hoge4 { font-size: 1.5em; }    /* 文字の大きさを指定 */
.hoge5 { background-color: #FFEFD5; } /* 背景色を指定 */

実際の表示

文字色 color: #FF6600;

テキスト

文字の太さ font-weight: bold;

テキスト

枠線を表示 border: solid 1px #FF9900;

テキスト

文字の大きさ font-size: 1.5em;

テキスト

背景色を指定 background-color: #FFEFD5;

テキスト

text-decorationプロパティで取り消し線を表示する方法

html

<span class="hoge6">テキスト</span>

css

.hoge6 { text-decoration: line-through; } /* 取り消し線を表示する */

実際の表示

テキスト

関連リンク

del要素

その他のデザインはcssでスタイルを指定





(C)2012 ホームページ作成無料