*

メーカー小売希望価格や通常価格に打ち消し線を引く(CSS)

公開日: : 最終更新日:2017/01/07 CSSやHTML、CGI

価格に打ち消し線

打ち消しと言えば<s>だったのですが、今はCSSで書きます。

この画像のように、希望小売価格の数字と(税込)に打ち消し線を引きたいと思って、CSSの編集から「text-decoration:line-through」と入力して更新をしたのにいっこうに変化しません。

これはバグ(エラー)だな。しっかりしてくれよEストアーさんよ!

と思ったら、打ち消し線はそこで設定するのではなく別の箇所でした。

「デザイン設定」→「商品詳細ページの設定」と進みます。

んで、これ。
打ち消し線の設定

あるんやないか~い!

わかりにく・・・

ちなみに、せっかくなので、テキストに付ける線関係のCSSについて復習しましょう。

1.text-decoration:none(何にもなし)

何もなし

2.text-decoration:underline(下線)

ここテストに出るよ。

3.text-decoration:line-through(打ち消し線)

小売り希望価格:4億3000万円

4.text-decoration:overline(テキストの上に線)

これいるか?

5.text-decoration:blink(チカチカ点滅)

ちょっと目立たせたいときに
(※点滅で見えている方は、そのブラウザは古すぎです。Chromeに変えましょう。)

さらに、マニアックなことををやってしまいましょう。CSSにはない二重線での打ち消し方法です。意外に簡単で、画像で消すというものです。価格の背景に打ち消し用の画像を入れてしまいます。

.line2
{
background-image:url(画像のURL);
background-repeat:repeat-x;
background-position: center;
}

ただし、このパターンでの、ショップサーブのCSSカスタマイズはちょっとむずかしいのでカット!



Adsense

関連記事

EC CUBE HETEML

EC CUBEを使う場合の注意点(共用SSL)

「EC CUBEを使ってお店を作りたい。お店サイトは独自ドメインで、カード部分は共用SSLを使いたい

記事を読む

CGIとSSL

ショッピングカートCGI利用時はSSLに

SSLとは通信の暗号化のこと。お客さんが個人情報やカード情報を送信するときは、必ず暗号化通信にするこ

記事を読む

ケントウェブ

WEB MART(KentWeb) を設置してみた

KENT WEBさんを久々に見ると、カートCGIがちょいとバージョンアップしていたので、おもしろそう

記事を読む

レスポンシブWEBデザイン

レスポンシブ・デザインへの移行に際し学んだこと(その1)

自分のサイトをスマホで見た時の残念感・・・なんとかしたい。でもやる気ない・・・そんなこんなで数年が経

記事を読む

カスタマイズ

WEB MART(KentWeb)カスタマイズ

WEB MART CGIの続き。購入は最低限のスッキリ3ステップなので、カスタマイズもしやすく、かつ

記事を読む

サイドナビ

yahoo! shopping サイドナビの編集

動画付き解説版できました~ デザイン設定で、「とりあえずお店らしく」と考えた場合、ヘッダー

記事を読む

オンエアー

「今、店長います。」をON AIR画像を使って表示させる方法

確か、10年近く前の、日経MJ「にぎわう専門通販」という記事で取り上げられていたショップサーブユーザ

記事を読む

ショッピングカート

「共同購入(CGI)」役目終える

サイト引越しのときのCGIの断捨離中に共同購入のCGI(共同購入システム3 coopbuy3.cgi

記事を読む

ヤフートップ

yahoo! shoppingのトップページはどうやって作るのですか?

無料で、しかも、地方の父ちゃん母ちゃんでも出店できてしまうyahoo! shopping。ライト出店

記事を読む

サーバーエラー

CSV編集CGIがない

放置気味の自作サイトのCSVファイルをウェブ上で編集するためのCGIを探してみたところ、意外にないん

記事を読む

Adsense

Adsense

整骨院でハロー効果
整骨院のハロー効果とプラシーボ効果

腰痛で接骨院だか整骨院だかに行ったとき、若いセンセが見てくれて電気治療

タイミング
「ビジネスはタイミングが大事」で失敗した例

商売は「早すぎてもダメ。遅すぎてもダメ。タイミングが大事。」なんて言い

ドロワーメニュー
スマホランディングページに最適なドロワーメニュー

ショップサーブのスマホページにドロワーメニューを取り付けるために大奮闘

儲かりまっせ
ただで仕入れたモノを5万円で売る。

ITの世界は「ボロ儲けできる」というのが垣間見れるサービスが、ショップ

読みたくなる
つい読みたくなる、クリックしたくなるタイトルの作り方

捨てメアドの整理をしていたらキャッチコピー系のメルマガが気になってつい

→もっと見る

PAGE TOP ↑