文字に取消線を引く

text-decoration: line-through;

CSSの書き方

text-decoration:値 値 … ;

CSSの詳細情報
プロパティ名 text-decoration 読み方 テキスト・デコレーション
初期値 none 意味 文字装飾
none/line-through
対象 すべての要素
CSSレベル CSSレベル1 対応ブラウザ Windows MAC
継承 しない IE 5.0以上/FF1.0/NS7.1/OP8.0 SF/IE5.0

解説

文字を取り消す場合に、文字の上から取消線を引くスタイルシートです。

ただし、あくまでデザイン上の取消線に過ぎないので、論理的な取消線とは成り得ません。

論理的に取消線を引く場合には、HTMLタグ<strike>によりHTMLの構文上で指定します。

なお、この値は「text-decoration」に対する一つの値ですので、同じプロパティの値(例えば下線underlineなど)も同時に記述することができます。

この場合は、例のように値同士を半角スペースで区切ります。

CSS/HTMLサンプル

span.stk { text-decoration:line-through; }

SPAN要素に対し、クラスで取消線を指定 サンプル

【厳選】合わせて読みたいおすすめ書籍

WEB制作支援サイトのHTMLタグボードだからオススメできる厳選書籍です。私が読んでいない本はオススメしません。

HTMLやCSS、Webデザインを体系的に学ぶなら

CSSを駆使したモダンなWebデザインを学ぶなら

最新情報をチェックしよう!