貼っていただけたらうれしいです


Yahoo!ブックマークに登録



Googleブログ内検索
Loading
2009-03-06 10:40:31

CSS 二重の取消し線・打ち消し線

テーマ:ブログ

これも問い合わせが多いです

取り消し線(打ち消し線)・・・・・

色違いの取り消し線はどうやるのですか?


コレについては


http://ameblo.jp/exlink/entry-10132377749.html

ここにありますので参考にしてください




・・・・・じゃあ・・・普段よく使う二重の取り消し線は?

これはHTMLにもCSSにも残念ながらありません・・・・

googleで二重取消し線、二重取消線、二重打ち消し線 などで調べても出てきません
諦めてください・・・・

えっ?・・・・  じゃあ・・・・ ↑は?




うっふっふ・・・・ 残念ながら二重の取り消し線でも二重の打ち消し線でもありません




ただの・・・・ 背景画像です・・・・・



アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!    アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!    アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!    アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!    アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!    アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!    アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!

こんな画像を(透過処理済み)用意します

で、CSSに

.doubleline {/*二重取り消し線*/
background-image:url(画像のURL);
background-repeat:repeat-x;
background-position: center;
}


使うときは記事を書くで文章を書き終わってから・・・・

あるいは記事の編集でHTMLタグを表示にして

二重取り消し線を引きたい文章の前に  <span class="doubleline">

文章の終わりに </span> をつけると 

<span class="doubleline"> と </span> の間に二重取り消し線が表示されます


<p>よく使う<span class="doubleline">二重の取り消し線</span>は?</p>

     ↓

よく使う二重の取り消し線は?


取り消し線が2行にわたる時は1行ずつ <span class="doubleline"> と </span> で囲ってください


<p><span class="doubleline">もし2行以上に</span><br />

<span class="doubleline">二重の取り消し線をひきたい場合は</span></p>
    ↓

もし2行以上に
二重の取り消し線をひきたい場合は



アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦!
上はhttp://ameblo.jp/exlink/entry-10132377749.html で説明している取り消し線です

ちゃんと文字の上に表示されて文字を取り消しています


下はココで説明している方法です

残念ながら背景画像なので文字の下(裏)に線が表示されています

文字と同色にすれば関係ないのですが・・・・


でも・・・ ほんとうに文章を見せたくなければ削除します

取り消し線を使う場合は消した文章も見せておきたい場合に使いますからこの方がベターなのかも・・・

AD
いいね!した人  |  コメント(8)  |  リブログ(0)

実験委員さんの読者になろう

ブログの更新情報が受け取れて、アクセスが簡単になります

コメント

[コメントをする]

8 ■わかりやすい!

とてもいいブログですね。
見てて楽しくなる工夫がされていて素晴らしいです。
今後もいろいろと参考にさせていただきます。

二重打ち消し線の入れ方がわからなくてあちこち調べてたらこちらへたどり着いたのですが、おかげさまでバッチリ理解できました。とてもわかりやすかったです!
ありがとうございました。
これからもよろしくです。

7 ■無題

ありがとうございます。

ちなみに、どのように持ち帰ればようのでしょうか?どこに、コメントの背景の画像はアップされているでしょうか?

よろしくお願いします。

6 ■>さる さま

当ブログの素材はお持ち帰り自由です

ほかの素材サイトの素材にはダメですって注意書きしてあります
また著作権絡みの素材は自分の責任でお持ち帰りください

パソコンが直ったら他に作った素材もアップしておきます
ノート関係の素材は良いのがありませんでしたので全部が自作画像です

5 ■>>りゆぅさん

スタイルシートではなくHTMLタグですが……

<u>テキスト</u>

これで点線ではないのですがテキストの下に下線を引けます

あるいはこの記事のスタイルシートをそのまま使って二重線ではなく点線の画像を自作して設置してみてはどうでしょうか

4 ■お久しぶりです。

ダメ元でお願いなのですが、コメント書いた時の背景画像。ノートの切れ端。(このコメントの背景画像ですね)この素材は使わせて頂けたりしないでしょうか?

近々、アメブロでリレー小説をやろうと思っています。そこで使わせて頂きたいのですがダメでしょうか?

もし、他にもノートの切り端や、メモ書き背景などの素材がある無料サイトとがあれば教えて頂けたら嬉しいです。


3 ■無題

いつもこちらにお世話になっています!
すみません、聞きたいのですが
記事の文字の下に下線(点線)を引きたいのですが
どこをいじればいいですか?

2 ■>>あい、さん

はい、どうぞ

■オリジナルスキンCSSの編集 記事枠(画像)
http://ameblo.jp/exlink/entry-10118178746.html

こちらでどうでしょうか?
出来ましたか? 出来ませんでしたか?

1 ■無題

質問いいですかっ?

私のブログに
記事枠ついてるぢゃないですか?

あそこを、画像にすることは
できますか?

できたらおしえてください(ノω・、)

コメント投稿

AD

ブログをはじめる

たくさんの芸能人・有名人が
書いているAmebaブログを
無料で簡単にはじめることができます。

公式トップブロガーへ応募

多くの方にご紹介したいブログを
執筆する方を「公式トップブロガー」
として認定しております。

芸能人・有名人ブログを開設

Amebaブログでは、芸能人・有名人ブログを
ご希望される著名人の方/事務所様を
随時募集しております。