【WordPress】 STINGER3のblockquote(引用タグ)の背景を変えてみた

公開日: : 最終更新日:2018/08/29 WordPress, テクノロジー, 小技

ブログで記事を書くときによそのページの本文やニュース記事の一部を引用することがあります。その場合はblockquoteというタグを使用します。

<blockquote>
ここに引用したい文章を入れる
</blockquote>

このブログはSTINGER3というテーマで構築しているのですが、blockquoteの背景デザインが角ばっていてちょっとダサい(開発者の方すみません。。。)

▼デフォルトのblockquoteの背景デザイン
stinger3 blockquote

というわけでcssをいじってデザインを変えてみました。

STINGER3の引用タグ(blockquote)の背景を変更する

やり方はとても簡単。style.cssの208行目あたりとsmart.cssの122行目あたりの

上記cssを、

に書き換えるだけです。

※必ず事前にバックアップを取っておいてください。

角丸で背景色をベージュに、落ち着いたデザインになりました。
stinger3 blockquote
こちらのページで実際に見られます。

ちなみに書き換え後cssの3行目にある

content: “\275D”;

はフォントアイコン「UTF-8 Icon」です。

UTF-8のフォントアイコンとはUTF-8で読み込まれたファイルに対して、UTF-8の文字コードを入力するだけでフォントアイコンとして表示することができます。

参考:
http://start-now.link/100/archives/1992
http://web-tan.forum.impressrd.jp/e/2016/06/07/23018

こちらのサイトにいろんなアイコンのUTF-8コードが掲載されています。
https://www.utf8icons.com/

今回採用したダブルクォーテーション(“)以外にもたくさんありますので、お好みに合わせて選んでみてください。

PC

最後までお読みいただきありがとうございます。

お手数でなければ記事のご紹介をしていただけると嬉しいです。

ブログの情報はこちらでも配信しています。



関連記事



個人的に撮影した写真を公開しています。

旅行先や街中で気になったものを撮影・公開しています。
ダウンロード無料、商用利用OKです。写真AC

関連記事

十六茶 アイコン

韓国から持ち帰ったおもしろいもの

先日韓国に行ったときに見つけたおもしろいものをいくつかご紹介します。 17茶 日本で

記事を読む

イヤホン端子に繋ぐだけ 手軽にTVの音質を上げるスピーカー「Olasonic TW-D5TV(B)」

普段見るTV番組といえば朝の情報番組と夜9時のニュースだけ。 そのニュースのアナウンスもさることな

記事を読む

Facebookが乗っ取られた

まさか自分に降り掛かるとは。 facebook(個人用)のアカウントが乗っ取られた模様。 自分に

記事を読む

【体験談】 クレジットカード(アプラス クレジット機能付きTカード)が不正利用された時の対処方法について

先日、三ヶ月半におよぶ長い長い対応が終わりました。 もし不幸にも同じ経験をされた方がいたら、また今

記事を読む

結婚式

最近の結婚式は手が込んでるなぁと思った件

先週末、友人の結婚式に参加してきた。 この1年は私の周りで「結婚式ブーム」が巻き起こっており、頻繁

記事を読む

出る アイコン

Googleの検索結果にサイト内検索フォームが出現

何気なくGoogleで検索していたところ、昨日までなかった機能が追加されていました。 (私が気が付

記事を読む

【悲報】 PCの画面をワイヤレスでテレビに出力可能なデバイス「AIRTAME」は日本に出荷できないことが判明

昨年末にGIGAZINEで取り上げられていた、PC画面をテレビに無線で出力するデバイス「AIRT

記事を読む

ほつれなおし アイコン

ほつれなおし用の針でセーターの糸引きを直した件

こんにちは。 今日も飽きもせずバーゲンに行ってきました。 昨日、セーターの引っ掛けた糸を直す

記事を読む

【STINGER3】 Excel to HTMLでテーブルがきれいに表示されるようcssを編集してみた

先日下記の記事をリライトしました。 蛍光灯が点きにくくなったらグローランプを交換しよう その

記事を読む

ネット回線サポートの仕事をしている友人に聞いた! 【価格別】 プロがおすすめするWi-Fiルーターをご紹介

こんにちは、目に見えないものにはお金をかけたくない男、しんこー(@yakudatsujoho)です。

記事を読む

PC

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

PC

キャンパスライフ
採用担当者からアドバイス、楽しい大学生活を送るために必要な11のこと

こんにちは、しんこー(@yakudatsujoho)と申します

社会人になった今だから断言できる、大学生におすすめのアルバイト12選

こんにちは、社会人○○目のしんこー(@yakudatsujoh

もしもし ポリスメン
【最大報酬10万円】 身バレもなく安心、警察への匿名タレコミができる「匿名通報ダイヤル」

犯罪もしくは犯罪の可能性がありそうなシーンに出くわしたが、逆恨みが怖く

公的保障 アイコン
【公的保障】 取りっぱぐれは大損! 届け出をするだけでもらえるお金

自治体によっては届け出だけでもらえるお見舞い金や支援金などが存

【情報流出リスク】 フラグを立てられたら終わり? プライバシーを守るためには「物理的破壊」をするしかない

LINE流出はまさに新時代的事件 一昨年1月に「まだやるか!

→もっと見る

  • 名前:しんこー
    仕事:WEB関連の仕事を10年ほど。デザインからコーディング、SEOなど幅広く手掛けている為、社内では「何やってる人?」と思われている。俺にもわからん。
PAGE TOP ↑