質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

Q&A

0回答

686閲覧

wordpressの記事一覧の所にリストスタイルのドットがついてしまう。

Tatsuki7226

総合スコア1

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

0グッド

0クリップ

投稿2020/05/20 11:41

教えていただける嬉しいです。

wordpressで記事一覧を表示する際に
各記事のところにドットがついてしまいます。
検証したところ、ulタグがついていたので
それを治す為に
li{
list-style:none;}
と記述したのですが、改善しませんでした。

<!doctype html> <html lang="ja"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> <link rel="stylesheet" href="style.css"> <title>My Theme</title> </head> <body> <header> <div class="container"> <h1 class="h1 py-3">My Theme</h1> </div> </header> <!-- グローバルナビ --> <nav class="navbar navbar-expand-lg navbar-light bg-dark"> <div class="container"> <a class="navbar-brand text-white" href="#">HOME</a> <button class="navbar-toggler bg-white" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item active"> <a class="nav-link text-white" href="#">wordpress</a> </li> <li class="nav-item active"> <a class="nav-link text-white" href="#">html</a> </li> <li class="nav-item active"> <a class="nav-link text-white" href="#">CSS</a> </li> <li class="nav-item active"> <a class="nav-link text-white" href="#">PHP</a> </li> </ul> </div> </div> </nav> <main class="bg-light"> <div class="container"> <!-- ピックアップ --> <div class="row py-3"> <div class="col-md-4 col-12"> <div class="bg-white py-3"> <!-- サムネイル --> <div class="pb-3"> <img class="img-fluid" src="<?php echo get_template_directory_uri(); ?>/img/_DSF6150-2.jpg"> </div> <!-- 記事タイトル --> <h2 class="h4 px-3 pb-3">ピックアップコンテンツピックアップコンテンツ</h2> <!-- ボタン --> <div class="text-center"> <a href=""> <div class="d-inline-block border p-3 text-secondary"> READ MORE </div> </a> </div> </div> </div> <div class="col-md-4 col-12"> <div class="bg-white py-3"> <!-- サムネイル --> <div class="pb-3"> <img class="img-fluid" src="<?php echo get_template_directory_uri(); ?>/img/_DSF6150-2.jpg"> </div> <!-- 記事タイトル --> <h2 class="h4 px-3 pb-3">ピックアップコンテンツピックアップコンテンツ</h2> <!-- ボタン --> <div class="text-center"> <a href=""> <div class="d-inline-block border p-3 text-secondary"> READ MORE </div> </a> </div> </div> </div> <div class="col-md-4 col-12"> <div class="bg-white py-3"> <!-- サムネイル --> <div class="pb-3"> <img class="img-fluid" src="<?php echo get_template_directory_uri(); ?>/img/_DSF6150-2.jpg"> </div> <!-- 記事タイトル --> <h2 class="h4 px-3 pb-3">ピックアップコンテンツ1ピックアップコンテンツ1</h2> <!-- ボタン --> <div class="text-center"> <a href=""> <div class="d-inline-block border p-3 text-secondary"> READ MORE </div> </a> </div> </div> </div> </div> <div class="row py-3"> <!-- メインコンテンツ --> <div class="col-md-8 col-12"> <?php if ( have_posts() ) :while ( have_posts() ) : the_post(); ?> <div class="bg-white py-3 mb-5 text-center"> <!-- 日付 --> <p><?php the_time('Y/n/j'); ?></p> <!-- 記事タイトル --> <h2 class="px-3 pb-3 font-weight-bolder"><?php the_title(); ?></h2> <!-- カテゴリー --> <p><?php the_category(''); ?></p> <!-- サムネイル --> <div class="pb-3"> <?php if ( has_post_thumbnail() ) : ?> <?php the_post_thumbnail( '', array( 'class' => 'img-fluid' ) ); ?> <?php else : ?> <p>サムネイルがないです</p> <?php endif; ?> </div> <!-- ディスクリプション --> <p class="text-secondary"><?php the_excerpt(); ?></p> <!-- ボタン --> <div class="text-center"> <a href="<?php the_permalink(); ?>"> <div class="d-inline-block border p-3 text-secondary"> READ MORE </div> </a> </div> </div> <?php endwhile; else : ?> <p>記事がありません。</p> <?php endif; ?> </div> <!-- サイドバー --> <div class="col-md-4 col-12"> <!-- プロフィール --> <div class="container bg-white mb-5 py-5"> <div class="mx-5"> <img class="img-fluid rounded-circle" src="<?php echo get_template_directory_uri(); ?>/img/_DSF6150.jpg" alt=""> </div> <div class="text-center"> <h4 class="d-inline-block py-3 border-bottom border-info">ああああ</h4> </div> <p>テキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> <!-- 検索窓 --> <div class="container bg-white mb-5 py-5"> <form> <input type="text" class="form-control" placeholder="Search for"> </form> </div> <!-- 読んで欲しい記事 --> <div class="container bg-white mb-5 py-5"> <div class="text-center py-5"> <h4 class="d-inline-block py-3 border-bottom border-info">読んで欲しい記事</h4> </div> <div class="pb-5"> <!-- サムネイル --> <div class="pb-3"> <img class="img-fluid" src="<?php echo get_template_directory_uri(); ?>/img/_DSF6150-2.jpg"> </div> <!-- 記事タイトル --> <h5 class="h5">ピックアップコンテンツピックアップコンテンツ</h5> </div> <div class="pb-5"> <!-- サムネイル --> <div class="pb-3"> <img class="img-fluid" src="<?php echo get_template_directory_uri(); ?>/img/_DSF6150-2.jpg"> </div> <!-- 記事タイトル --> <h5 class="h5">ピックアップコンテンツピックアップコンテンツ</h5> </div> <div class="pb-5"> <!-- サムネイル --> <div class="pb-3"> <img class="img-fluid" src="<?php echo get_template_directory_uri(); ?>/img/_DSF6150-2.jpg"> </div> <!-- 記事タイトル --> <h5 class="h5">ピックアップコンテンツピックアップコンテンツ</h5> </div> </div> </div> </div> </div> <foote class="bg-white"> <div class="container"> <div class="row"> <div class="col-md-4 col-12"> <div class="pb-5"> <h4 class="d-inline-block py-3 border-bottom border-info">About</h4> </div> <p>テキストテキストテキストテキスト</p> </div> <div class="col-md-4 col-12"> <div class="pb-5"> <h4 class="d-inline-block py-3 border-bottom border-info">Portfolio</h4> </div> <div class="p-3 border-top border-bottom border-secondary"> <a class="text-secondary" href="">ポートフォリオサイト</a> </div> <div class="p-3 border-top border-bottom border-secondary"> <a class="text-secondary" href="">ポートフォリオサイト</a> </div> </div> <div class="col-md-4 col-12"> <div class="pb-5"> <h4 class="d-inline-block py-3 border-bottom border-info">Twitter</h4> </div> <a class="twitter-timeline" data-lang="ja" data-height="600" data-theme="light" href="https://twitter.com/TwitterJP?ref_src=twsrc%5Etfw">Tweets by TwitterJP</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> </div> </div> </div> <div class="bg-dark text-white text-center p-3"> Copyright-tasuki inamura,2020 All Rights Reserved </div> </footer> </main> <!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script> </body> </html>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問