【超簡単】LivedoorにCSS(デザイン)を反映させる方法
はじめに
余談を飛ばすにはこちらをクリック
先日、ストレスが原因なのか分かりませんが、
『頭痛』と『腹痛』と『腰痛』
におそわれ寝込んでいたそっすぃ〜です笑
今もお腹あたりにすごい鈍痛を感じるのですが
頑張って記事を書いていきます。
にしても、ストレスで体調を崩したのは
振られた時以来・・
ストレスは思い込み
まあ確かに、極度のプレッシャーを浴びていたから
ストレスが原因なのかもしれない..。
ストレスは、それ自体が有害なのではなく、
ストレスを『有害だと思うこと』が有害なのだ。
と、スタンフォード大学の心理学者
ケリーマクゴニガルさんが検証実験で証明していますね。
仮にそうだとしても、ストレスをストレスだと
感じないようにするなんて無理だとは思うのですが笑
本題に戻りますね！すいません。
スマホサイトにCSSが適用されない
前回の記事で、ブログのデザインをアレンジする方法を
書きましたが、スマホで閲覧すると...
あれ？デザインが反映されていない...
パソコン版は、このようにきちんと反映されていますね。
色々試行錯誤した
調べていくと、cssファイルをアップロードする〜、、だの
HTMLにファイルへのリンクを貼る〜、、だの
色々書いてありました。
が、どれも上手くいかない...
と苦戦していた私ですが、
反映させる方法はいたってシンプルなものでした。
記事投稿画面に直接書くだけ
記事投稿画面の、HTMLタグ編集モードの画面に、
変更させたいCSSコードを入力するだけ
でした笑
いや〜こんなに単純な問題だったとは笑
見事に反映されていますね！
一サンプルとして、コードをご用意しておきます。
<style type="text/css">
.article-body h2{
margin: 0 0 1.5px;
padding: 0.3px;
background: #4169e1;
color: #fff;
border-radius: 3px;
}
.article-body h3 {
margin: 0 0 1.5px;
padding: 0.3px;
border-left: 7px solid #4169e1;
border-bottom: 2px solid #99CCFF;
}
</style>
このように貼り付けられればオーケーです！
それでも反映されない場合
それでも反映されない場合は、見出しにする変更ではなく
フォントサイズをいじっている場合があります。
こちらの-2〜+3で文字の大きさを変えてみます。
テキスト(+1)
HTMLコードから直接、見出し設定をします。
テキスト(h3)
前者は<span style="font-size: 125%;"></span>で囲まれていますね！
後者は、テキストを直接<h3> </h3>で囲んでいます。
おわりに
いかがでしたでしょうか！
数年前にもブログを書いていたのですが、
その時はプログラミング知識が全くなく、
ブログのデザインをいじるなんてことはできませんでした。
プログラミングを勉強したおかげで、
より自分好みのデザインを作ることができるようになりました！
皆さんも、ぜひ
プログラミングを勉強してみてはどうでしょう^^
