StrawMan Templateの簡易コード置き場
2019/11/21 01:14
0
StrawMan Templateについてのやり取りで提供した、ちょっとしたコードを公開しています。
類似のケースでお悩みの方の参考になれば幸いです。
サイドバーの見た目を調整するcss。
![00070.jpg]()
→ ![00072.jpg]()
タイトル、ボーダーライン、ボーダーライン上下の余白調整
下記のcssを
FC2管理画面→テンプレートの設定→スタイルシートの編集の一番下にコピペ
※cssは最新のもの（一番下）が適用されます。
この特徴を利用し、該当部分を抜き出して追記することで本来のコードを変えずに調整したり、レイアウト関連をまとめて管理できます。
・サイドバーのタイトル下のライン
border-top: 2px solid; （２ピクセルの直線）
→border-top: 0; （線が消える）
・数値変更で余白量が変わる
margin-top: 0.3rem;
padding-top: 1.3rem;
・数値変更でタイトル文字サイズが変わる
font-size: 1.2em;
レイアウトが重く感じたときは、お好みの値に調整してください。
類似のケースでお悩みの方の参考になれば幸いです。
サイドバーのプチカスタマイズ（タイトル文字サイズ/区切り線/余白）
サイドバーの見た目を調整するcss。
→ 
タイトル、ボーダーライン、ボーダーライン上下の余白調整
下記のcssを
FC2管理画面→テンプレートの設定→スタイルシートの編集の一番下にコピペ
サイドタイトル文字サイズ/区切り線/余白css
※cssは最新のもの（一番下）が適用されます。
この特徴を利用し、該当部分を抜き出して追記することで本来のコードを変えずに調整したり、レイアウト関連をまとめて管理できます。
・サイドバーのタイトル下のライン
border-top: 2px solid; （２ピクセルの直線）
→border-top: 0; （線が消える）
・数値変更で余白量が変わる
margin-top: 0.3rem;
padding-top: 1.3rem;
・数値変更でタイトル文字サイズが変わる
font-size: 1.2em;
レイアウトが重く感じたときは、お好みの値に調整してください。
- 関連記事