AFFINGER4の親テーマのCSSを見ると、「引用もどき」というCSSがあります。これは「引用ではないが、引用風に見せたい」部分に使えます。
引用した文章
引用もどきを使って引用ぽい文章を表示
この「inyoumodoki」を「.inyoumodoki-me」などとして好みの色で利用したくなって、こう指定してみました。真っ白にして中央揃えです。
背景色を変更した引用もどき。背景色を変更した引用もどき。背景色を変更した引用もどき。背景色を変更した引用もどき。
文章ならマージンを上下に50pxという設定をしたほうが良さそうです。引用もどきオリジナルバージョンは、実際には商品画像に利用しています。
商品紹介をしっかりしたい場合にはこれでは全然ダメです。念のため。
ところが───
エラーが出てしまうのです。確認すると background-image: url(images/quote.png)の quote.png の部分でした。
デフォルトなら普通に読める部分が、自分で勝手につくったから読めないのか、“は必要ないのだから、画像は無いよってことにすればいいと考えて、検索しました。
そして background-image: none; とすることで解消しました。私が変更した部分だけ見えるようにしておきます。
このCSSの設定にあたり、こちらのサイトを参考にしました。
[sc name=”AFFINGER PACK3 WING”]