閉じる
閉じる

あまめも

リストテンプレートも作っておいた方がいいかな?と思ったので作成!

こんにちは! あますた(@amaguristar)です。

先日、「目次テンプレート」を作成。実際に使用しはじめたら思ったよりいい感じ。「これはついでに”リストのテンプレート”も作成しておこうかな?」って流れです。

 

目次

リストテンプレート

通常リストを使う時はこんな感じ、

  • list1
  • list2
  • list3
  • ・・・・
  • まとめ

これでもいいのですが、目次を使い始めたらちょっと・・・・。なんて言うか目次は頑張った感があるのに対して手抜き感が半端ない。

今回も下記サイトにお世話になります!

参考にしてこのページ用に調整をかけたのが、

  • list1
  • list2
  • list3
  • ・・・・
  • まとめ
  1. list1
  2. list2
  3. list3
  4. ・・・・
  5. まとめ

やっぱり文字の感覚は統一した方が良いですね。あとは「・」や「数字」の文字位置は枠から少し離れた方がゆったりしてるので好みです。実際のcssは、

ul.ctk-list, ol.ctk-list {
    background: #fcfcfc;
    border-radius :5px;
    box-shadow :0px 0px 3px silver;
    padding: 0.5em 0.5em 0.5em 2.5em;
}
ul.ctk-list li, ol.ctk-list li {
    line-height: 1.5;
    padding: 0.5em 0;
}

です。今後のリストはこちらを使用。今までの記事も順次変えていこう!

関連記事

  1. 特殊文字

    特殊記号を数字参照(コード直打ち)して文字化けを回避する方法

  2. [甘]気になってしょうがないのでさっそく画像表示を直してみた。

  3. 色々とあったのでWordPressをエディタで書こうとしてとりあ…

  4. [甘]WordPressで『プラグインが動かない!?』ってときの…

  5. サイトデザイン

    「サイトでキーワードを目立つ様に囲みたい!」そんな時はcssでク…

  6. 知らなかった!WordPressで写真(画像)にキャプションを付…

こんなメモもありますよ♪

  1. 勝牛看板
  2. thumbnail-pudding

Twitter

ページ上部へ戻る