[東福 まりこ]

記事の本文中の箇条書き、重要なポイントに使っているので、線で囲みたいのです。

下記のcssで設定すると、「番号」と「・」が枠からはみででしまいます。番号と「・」もあわせて線で囲むことはできますか？

.c-entry__content ul { border : 2px solid #32978B ; }
.c-entry__content ol { border : 2px solid #32978B ; }

また、本文中の箇条書きを上記の枠で囲むcssを書くと、それが目次にも反映されてしまうので、それを消す方法。

以上の２つ、できますでしょうか？

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

とりあえず、

.c-entry__content > ul {
  border : 2px solid #32978B;
  padding: 1em;
  margin-left: 0;
}

.c-entry__content > ul > li {
    margin-left: 1em;
}

こんな感じでどうでしょうか？

これで目次には影響はでないと思いますが、すべての箇条書きに反映されてしまうので、できれば適当な class を付けたりして、それにスタイルを当てるほうが良いかもしれません。

♥ 0

いいねをした人: 居ません

[東福 まりこ]

早速ありがとうございます。

いただいたコードで記事に反映するのを確認しました。確かに場合によって囲んだり囲まなかったりできるといいですが、今はこれで十分に使えます。

ありがとうございました！

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

良かったです！

いま、オンラインコミュニティで、Snow Monkey Blocks という Snow Monkey 専用のプラグイン（アドオン）をメンバー特典として無料配布していまして、それを使うと囲んだり囲わなかったりが結構簡単にできます！もうちょっとしたら有料販売に切り替える予定ですので、いまのうちにダウンロードされるのをおすすめします！（はじめにのスレッドにダウンロードリンクを書いています）

Gutenberg 専用でクラシックエディターでは使えませんのでご注意ください><

参考動画

♥ 0

いいねをした人: 居ません

[投稿者]

投稿