Q&A
コードやエラーはマークダウンのcode機能を利用してご提示ください。
https://teratail.com/questions/238564
前提・実現したいこと
cssが反映されない部分の解消
該当のソースコード
html css
ソースコード
</head> <body> <div class="container"> <h1>You make me</h1><title>MAKE ME</title> <!-- CSS only --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous"> <link rel="stylesheet" href="css/style.css">
</html></div> <hr> <div class="container"> <p>Plrase post your...</p> <ol>select category</ol> <li><a href="#" target="_blank">songs</a></li> <li><a href="#" target="_blank">books</a></li> <li><a href="#" target="_blank">person</a></li> </div> </div> <hr> <!-- JavaScript Bundle with Popper --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script> </body>
body {
background-color: cadetblue;
font-size: 18px;
color:#fff;
}
h1 {
margin: (10px 0 0 0);
font-family: Arial, Helvetica, sans-serif;
padding: 20px;
}
hr {
font-weight: bold;
font-size: 3px;
color:#fff;
}
補足情報（FW/ツールのバージョンなど）
bootstrap4を使用
ここにより詳細な情報を記載してください。
回答1件
0
ベストアンサー
こんにちは。
hrは空要素のため内部にテキストを持たないので、テキストやフォントに関するCSSを指定しても、特に意味はないです。
許可されている内容 なし。これは空要素です。
投稿2021/03/01 02:22
総合スコア36946
こんにちは、丁寧なご説明ありがとうございます。なるほど納得しました！よろしければ枠線をcssを使った装飾する方法があれば教えていただきたいです(サイズ変更、カラーの変更など）。それとも枠線を装飾する方法はないのでしょうか。
ボーダーまたは背景色を指定するのがいいかと思います。
回答にあるリンク先の「HTML Demo: <hr>」をご覧ください。
あなたの回答
tips
プレビュー
