ライブドアスマホCSS

こんにちは。赤ペソ先生(@spinf60 )です。

ライブドアブログでブログを書きはじめて2年ほど経ちます。


ライブドアブログ気に入ってるんですが、どうしても納得行かない事があるんです。


それは……

スマホから見た場合、CSSが適用されない

ってこと。


パソコン版の表示は、デザインをガンガンいじれるし、文章を読みやすくするように入れる見出しも、わかりやすいように色付けできます。


が、しかし……


見やすいように見出しを入れて書いても、スマホから見た場合……

良く言うとシンプルすぎ……

悪く言うと文字の大きさしか変わらないので、もうわけがわかりません。

一応、この下にh2〜h6の見出しを書き出してみます。


見出し2(h2)

見出し3(h3)

見出し4(h4)

見出し5(h5)
見出し6(H6)

パソコンで見ると、見出しに色がついているのですが、スマホだと白黒です……。

しかも、スマホのデザインはほぼいじれないんですよ……


『スマホからの閲覧者が6割を超えている』というのに、ライブドアブログは何をやっているんだ?

とぶっちゃけ思うのです……(*_*;


そんなわけで、2年間ライブドアブログのスマホ表示と格闘し続けた結果……スマホ表示でCSSを適用できたので、その研究成果を発表します。


ちなみにこちらで、カスタマイズ方法を色々まとめてますのでご覧ください。


ちなみにこの下↓から適用された物を表示しています。

SPONSORED LINK


CSS適用サンプル

見出し

以前は見出しに直接スタイルを書き込んでましたが、ようやっとできた。

h2〜h6に、それぞれ class aka2〜6 を設定しました。

見出し2

見出し3

見出し4

見出し5
見出し6

見出し5,6はあまり使わないので同じ……(*_*;


その他のサンプル

この部分はCSSファイルに記入しています。

関連記事

関連記事へのリンク


 公式サイト

公式サイトへのリンク


 参考リンク

外部サイト、参考リンク用


ポイント

注目してほしいポイントに使う



強調したい時に使うつもりで作りました。


ドット枠


水色の強調枠


周辺ぼかし枠


縫い目のような枠


ふちがある枠


シンプルな枠


ふきだし会話

吹き出し会話は、CSSに書きましたよね?

そうそう。これね↓


まとめ

カスタマイズのまとめ記事もオススメです


そんなわけできょうのブログはここまで。
最後までご覧いただきありがとうございます。
またどこかのLogで(^_^)/~ 赤ペソ先生(@spinf60 )でした。


読者登録すると、ブログ更新した時にLINEでお知らせします♪


↓↓赤ペソ先生が利用しているサービスまとめ

おすすめ

SPONSORED LINK


「この記事がいいね!」と
君が言ったから
10月 21 日は
赤ペソ記念日♪

最新情報をお届けします

Twitterで赤ペソ先生をフォローしよう!