ALICE+サポート タグ・デザイン掲示板 TOPページ タグ・デザイン掲示板 h1~h6の下部の余白を狭めたい 編集 キャンセル 削除 アク禁 アク禁解除 キャンセル 凍結 0 Anonymous Chrome > <h1>見出し</h1> > <p>テキスト</p> 上のようにHTMLを記入したとき、見出しと<p>~</p>の間に一行ほどの余白ができました。 この余白を狭めることは可能でしょうか? 1 03/16 15:32 返信 コメント投稿 検索 2 Anonymous Chrome >>1 しち様 詳しく回答していただきありがとうございます。解決いたしました。 自動改行は考えもしなかったです・・・。 すぐに確認したところ、自動改行にするにチェックマークを入れていたため、余白ができていたようです。 お時間をいただきありがとうございました。 03/30 15:42 返信 1 しち SOG03 >>0 可能です。 要素と要素の間の余白(margin)幅を調整するには、スタイルシートを用います。 ただ一応念のため確認なんですが、 #〔□自動改行する〕にチェックが入っていませんか? >🔲入っていない 問題ないです。未チェックのままにして、スタイルシートでの余白調整に取りかかります。 (この状態なら、余白調整にはスタイルシートを用います) >☑️入っている 自動改行機能により『改行タグ(<br>)』が意図せず挿入されている可能性があります。 この場合は、2種類の対処どちらかで解決するかもしれません。 *🅰️━━━━━━━━━ <h1>見出し</h1><p>本文</p> *━━━━━━━━━━ などと、「見出し要素と本文段落要素の間に改行を入れない」形に書き直す。 *🅱️または、自動改行のチェックを外す。 ※ただし今まで挿入されていた改行タグすべてが消えるため、レイアウトが大きく変わるおそれがあります。 もし上記の🅰️ or 🅱️を行って不要な余白が消えたなら、スタイルシートをいじる必要はありません。 ###スタイルシートで余白(margin)を調整する※すでにスタイルシートで何かしらデザインしているなら、以下のスタイル指定はなるべく“ 既存の記述よりも下に書き足し ”てください。 ━━━━━━━━━━ h1,h2,h3,h4,h5,h6{margin-bottom:0;} p{margin-top:0;} ━━━━━━━━━━ >1️⃣ h1,h2,h3,h4,h5,h6{margin-bottom:0;} これで見出し要素の『下部の余白(margin-bottom)』をゼロにします。 >2️⃣ p{margin-top:0;} 本文段落(p)要素の『上部の余白(margin-top)』をゼロにします。 両要素ともデフォルトだと上下左右に余白が設定されているので、それをいじれば不要な余白は消えるかと。 1 03/30 13:27 返信 1ページ中1ページ目 400 view 残り書き込み 9998 件 人気スレ テンプレートが崩れてしまいます。 2022年11月18日 21時35分 13 position属性について。 2019年11月24日 13時46分 12 :beforeのcontentで記号を表示したい 2021年08月09日 13時45分 1 字下げをすると改行も一緒にしてしまう 2023年01月27日 22時36分 8 関連スレ 掲示板TOPへ サイトTOPへ ALICE+サポート