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

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

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

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

Q&A

0回答

310閲覧

bodyにbackground-colorを指定したいのですが、上手くできません。

abdds

総合スコア0

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

0グッド

1クリップ

投稿2022/04/19 12:22

編集2022/04/19 12:24

・やりたい事
bodyにbackground-colorを指定したい

・現状
ヘッダーやセクションなど各セレクタにはbackground-colorでそれぞれ指定できる状態。bodyだけができません。

・試みたこと
リセットCSS(destyle.css)とbootstrapをコメントアウトしてもダメでした。

何が原因でしょうか?
ご教授頂けますと大変助かります。

HTML

1 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" 2 integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> 3 <link href="https://fonts.googleapis.com/css2?family=Shippori+Mincho&display=swap" rel="stylesheet"> 4 <link rel="stylesheet" href="style copy.css"> 5</head> 6 7<body> 8 <header> 9 <div class="container"> 10 <a href="#" class="titleName">あああああ</a> 11 </div> 12 13 <nav> 14 <ul class="menu_box"> 15 <li class="menu_list"><a href="#">PROFILE</a></li> 16 <li class="menu_list"><a href="#">MUSIC</a></li> 17 <li class="menu_list"><a href="#">LIVE</a></li> 18 <li class="menu_list"><a href="#">CONTACT</a></li> 19 <li class="menu_list"><a href="#">ABOUT</a></li> 20 <li class="menu_list twitter_icon"><a href="#"><a href="https://twitter.com/_mekakusi" target="_blank"> 21 <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" 22 class="bi bi-twitter" viewBox="0 0 16 16"> 23 <path 24 d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z" /> 25 </svg></a></li> 26 <li class="menu_list instagram_icon"><a href="#" target="_blank"> 27 <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" 28 class="bi bi-instagram" viewBox="0 0 16 16"> 29 <path 30 d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z" /> 31 </svg></a></li> 32 33 34 </nav> 35 </div> 36 </div> 37 </header> 38 <!-- <div class="container"> --> 39 <div class="mainPhot"> 40 <img src="#" alt="アーティスト写真"> 41 <div class="inner"> 42 <p>テキスト</p><span>テキスト2</span> 43 </div> 44 </div> 45 </div> 46 <section> 47 48 <div class="container"> 49 <div class="profile"> 50 <div class="peofile_headling"> 51 52 </div> 53 <div class="career"> 54 <div class="career_box">

CSS

1@import url(destyle.css); 2 3body { 4 width: 100%; 5 font-family: 'Shippori Mincho', serif; 6 background-color: rgb(21, 28, 25); 7} 8 9header { 10 width: 100%; 11 height: 0; 12 color: #fff; 13 position: fixed; 14 z-index: 100; 15} 16 17section { 18 19} 20 21header>.container { 22 position: absolute; 23 margin-left: 50px; 24 font-size: 30px; 25 padding: 10px 0 0 40px; 26 27} 28 29.titleName a { 30 display: inline-block; 31 padding: 10px 30px 0 30px; 32 color: #fff; 33} 34 35.titleName:hover { 36 color: rgba(44, 41, 41, 0.545); 37} 38 39.menu_box { 40 width: 100%; 41 display: flex; 42 justify-content: flex-end; 43} 44 45.menu_list { 46 position: relative; 47 top: 20px; 48 display: inline-block; 49 margin: 0 15px; 50} 51 52.instagram_icon a:hover { 53 color: rgb(207, 46, 146.5); 54} 55 56.twitter_icon a:hover { 57 color: rgb(29, 161, 242); 58 transition: transform .5s, opacity .5s; 59}

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

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

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

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

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

m.ts10806

2022/04/19 23:22

><link rel="stylesheet" href="style copy.css"> style copy.css というファイル名なのですか?(スペースもファイル名にある)
abdds

2022/04/20 00:53

はい。半角スペースが入ってしまっていたので アンダースコアを入れてファイルもリンク先もstyle_copy.cssにしました。 (動作は何も変化ありませんでした。)
m.ts10806

2022/04/20 00:57

そのcssはhtmlと同じ階層にありますか? 位置関係がわかる図も追記願います
Lhankor_Mhy

2022/04/21 03:07

ご提示のコードを試してみましたが、問題が再現しませんでした。 おそらく、ご提示の部分には原因はなさそうに思います。 ご提示いただいていない部分に原因があるか、問題の共有が上手くできていないと思います。 問題再現の手順をもう少し詳しく書いていただけますか?
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.47%

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

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

質問する

関連した質問