CSSを変更すると、デザインをカスタマイズできる！

こんなんとか、

点線見出し

こんなんとか、

スタイルシート(CSS)に書くことで使えるようになる。

ど素人のわたしでも

＊カスタマイズする前に、バックアップをとっておくことをおすすめします
ライブドアブログのヘルプ(PC向け)

CSSを開く

ライブドアブログのブログ設定から

デザイン / ブログパーツ設定→PC



→カスタマイズ→CSSタブ





ここに装飾したいコードを追記する
（どこかのサイトで「いいな～」と思った装飾コードをコピペ）
例：

/* マーカーペン */
.marker3a-purple {
	background: linear-gradient(#fff 30%, #D2CCE6 70%);
}

記事本文を書く時、html編集画面でコードを呼び出す記述をする

<span  class="marker3a-purple">紫のマーカー</span>

↑↑↑定型文として登録しておくと便利

結果：

紫のマーカー

マーカー・吹き出し・見出し・囲い枠などいろいろかわいくカスタマイズ可能。

ここで問題発生。スマホでブログを確認すると、全く反映されていない。
変更を加えたCSSは、PC用のものだった。
スマホ版のCSSは、元々用意されていない

スマホ版表示をカスタマイズしたい！

いろいろカスタマイズできるＰＣ表示でブログを閲覧していただければ良いんだけども、今はみんなモバイル端末で見るんだよね。
そうなると・・・・どうしてもスマホ表示をカスタマイズして、かわいく見やすくしたい。

手順：

元々存在しないスタイルシート(css)を、作成する
テキストファイルを作成
（好きな名前.css）

ファイルの最初に
@charset "utf-8";
を記載することで、文字化けを防ぐ
（アップロード後文字化けすると、コードがうまく読み込めないことがある）



パソコンで作業していますが、
スマホでも作成可能。

スマホのみでCSS作成＆アップロード


ライブドアブログにCSSをアップロードする

マイページ→画像/ファイル→ファイル管理 から
先程のtest.cssファイルをアップロード



記事を書く際、htmlタグ編集でCSSを読み込ませる文を記述