ごにばです。
少し前のアメブロのエディタでは、記事内にCSSが書けない仕様になっていたと記憶しています。気の所為かもしれないですがｗ
ですが、新しい今のエディタになった、とある日にCSSを記事内に記述できることに気づきました！
そんなわけで、CSSでどういうことができるか？をご紹介。
◆CSSとは
HTMLで書かれたものをいい感じにしてくれるもの。
◆CSS作例
ごにばがよく記事の中で使うCSSなどをご紹介。
◇見出し１
見出し
CSS
.sample1 {
border-left:4px solid #4598ed;
border-bottom:1px solid #4598ed;
padding-left:4px;
margin-bottom:8px
}
◇見出し２
見出し
CSS
.sample2 {
border-left:4px solid #4598ed;
padding-left:4px;
margin-bottom:8px;
}
◇見出し３
見出し
CSS
.sample3 {
background: #4598ed;
color: white;
display: inline-block;
padding: 2px 8px;
}
◇見出し４
見出し
CSS
.sample4 {
display: inline-block;
border: solid 1px #4598ed;
display: inline-block;
padding: 2px 8px;
}
◇マウスオーバー
見出し
マウスオーバー前のCSSは「見出し３」と同じものを使用。
CSS
.sample4 {
cursor: pointer;
}
.sample4:hover {
background: #FF007D;
}
◇ハッシュタグの真似
見出し
CSS
.hashTag {
padding: 8px 16px;
border: 1px solid #e5e5e5;
border-radius: 30px;
display: inline-block;
}
◆CSSの設定の仕方と使い方
気が向いたら書きますｗ
◆最後に
CSSはHTMLテキスト内であれば、どこにでも記述することが可能です。つまり、フリープラグインの中に記述すれば、記事に毎回CSSを記載する必要はありません。
しかしながら、フリープラグインの読み込みはPCのみのようです。ですので、PCとスマホで見た目の差異がないようにするためには、記事内に埋め込むしかなさそうです。