どなたか教えてください・・ワードプレスでサイトを作っています。
<ul>などのリストタグを使うと、その前にある文章が<p></p>でくくられてしまいます。
<br />にしても、リストタグを使うとそうなってしまうのですがどうすればいいでしょうか。
なぜ、勝手にタグが書き換えられてしまうのか知りたいのです。
これはもうワードプレスのシステムの問題で自動的にそうなってしまうのでしょうか・・そのへんのことはよくわからないのですが。この質問をするにあたって何をお伝えすればいいのかわからないので、疑問な点ありましたら聞いてください。追記いたします。
<p>タグは行送りの間隔が広いのでデザイン的に見映えが悪くなり、使いたくないのです。
テーブルを使うなどするしかないんでしょうか?
表とかはあまり使うなと先輩にいわれているので、できればこの問題を解決できればうれしいです。よろしくおねがいいたします。
No.3ベストアンサー
- 回答日時:
通りすがりですが、wordpress使いとしてひとこと。
ブログ内の文章は基本的にp要素でくくられる必要がありますし(div要素内に直接文章を書くべきではない)、p要素の中に他のブロック要素を含めてはいけないというルールもあります。
従って、wordpressが
<p>テキスト</p>
<ul>
<li>リスト</li>
<li>リスト</li>
</ul>
<p>テキスト</p>
のように直してくれるのは正しいのだと私は思います。
> <p>タグは行送りの間隔が広いのでデザイン的に見映えが悪くなり、使いたくないのです。
ということであれば、記事内のp要素のmarginをCSSファイルで調整すればよいのではないかと思います。
参考URL:http://bakera.jp/ref/html/element/p
なるほど!!根本的なことに気づきませんでした。
cssに
p { margin: 0;}
を追加してみたらpの問題は解決いたしました。
p要素についての参考URLもありがとうございます。勉強になりました。
でもリストタグを使うとまだ空行が・・・これもcssで<ul>にmargin:0って命令することができるんでしょうか?ちょっといまごちゃごちゃしてて試す余力がない・・ので明日確認してみます。ありがとうございます。
No.4
- 回答日時:
peapeapeaさんの言う通りですね。
。CSSファイルでの調整が一番早くて正しいやり方だと思われます。
そのようですね。かなり苦手なので頭がショートしそうですがcssファイルでの調整が確実みたいですね。goalmaniaさんもありがとうございます。うれしかったです
No.2
- 回答日時:
ダミーテキスト<br />
<ul>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
</ul>
ダミーテキスト<br />
もしくは
ダミーテキスト<br /><ul>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
</ul>
ダミーテキスト<br />
気にはなりますがこれで解決する場合があります。。
No.1
- 回答日時:
管理画面の投稿する箇所にulやliのボタンとかはついていないでしょうか。
投稿エリアに直接書き込んでもソースは
<p>
<ul>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
</ul>
</p>
となり表示は下記のようになるということでしょうか?
<ul>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
</ul>
この回答への補足
ご質問ありがとうございます。リストにするボタンはついています。
投稿エリアで普通に改行すると</P>になってしまうので、細かく設定したいときはHTML編集画面に直接タグを入力しています。
いま私の状況は
ダミーテキスト
<br />
<ul>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
</ul>
ダミーテキスト<br />
と入力しても、
<p>ダミーテキスト
</p>
<ul>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
<li>ダミーテキスト</li>
</ul>
ダミーテキスト<br />
というふうに、リストタグを入れた前方の文章だけ<p>タグになってしまうということです。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- WordPress(ワードプレス) ワードプレスで、投稿一覧ページにタグを表示する方法 投稿につけたタグを、記事一覧ページにもカテゴリと 1 2023/05/10 21:41
- HTML・CSS HTMLのdlとul どちらが正しいと思いますか 3 2023/02/23 11:20
- ノートパソコン 古いノートパソコンVostro 3500の電源アダプターについて 3 2022/10/07 13:58
- HTML・CSS HPに文章で改行はすべてBRタグとかで改行しなきゃだめなのですか?改行が活きたまま書く方法ないの? 1 2022/12/03 21:00
- 洗濯機・乾燥機 前回の質問の続きです。 購入したブラジャーを洗おうとしたのですが、タグを見てみると洗濯機使用不可の記 2 2022/09/29 22:32
- HTML・CSS HTMLタグのあるCSVファイルを利用する方法 4 2023/03/19 14:41
- 父親・母親 父親の性癖について悩んでます。 先日、父の日に実家に遊びに行ったら、父親が知らない女性の使用済みパン 10 2023/06/20 01:55
- その他(プログラミング・Web制作) ワードプレスのプラグインであるAddQuicktagを使いたいが… 3 2022/04/18 15:03
- その他(ブログ) テレグラムをブログに埋め込むことはできますか? 1 2022/06/04 11:20
- ヤフオク! ヤフオクの利用制限について 4 2023/08/07 23:17
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CSS「table-cell」で横並びにし...
-
liタグの中に<p>タグやら<dl>を...
-
CSS質問:大手サイトを見ると何...
-
リセットCSSについて
-
円形の配置にするコーディング...
-
【至急】ul li 行間調整ができ...
-
HPを作成していますが、適切な...
-
ol、liをスタイルシートで中央寄せ
-
ol li の回り込みの避け方について
-
divタグ内のコンテンツが重なっ...
-
親ページ側からインラインフレ...
-
jQueryの導入方法について
-
CSSで、親要素にだけ中央揃えを...
-
画像にリンクを張ると画像がず...
-
「・」(黒い点)を非表示にした...
-
表の文字サイズ変更ボタンにつ...
-
HTMLで組織図を作成する方法
-
文字をテーブルで囲ったような...
-
リストマーカーをボックス内に...
-
リストの左余白の削除方法
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
<table>の高さ固定。情報増加時...
-
リストマーカーをボックス内に...
-
画像にリンクを張ると画像がず...
-
レスポンシブWebデザインでリン...
-
HTMLで組織図を作成する方法
-
ulタグやliタグの中でbrタグ...
-
ポップアップメニューを表のよ...
-
liタグの中に<p>タグやら<dl>を...
-
リストの数字のフォントサイズ...
-
<ul>~</ul>が二つ続くと間に改...
-
html <ul></ul>の並びで一行空...
-
ulとliで囲った文字の一部を変...
-
番号付きリスト(<Ol><Li>・・...
-
<ul><li></li></ul>にするメリ...
-
html/cssの、navを2段にする...
-
divタグ内のコンテンツが重なっ...
-
display:table;を多段表示させたい
-
HTML5のfooterに見出しを付けて...
-
リストを2つに分割して、それぞ...
-
ページを開いているときのリン...
おすすめ情報