前提・実現したいこと
ナビゲーションを横並びにしたい
発生している問題・エラーメッセージ
エラーメッセージ You have no background-color set (or background-color is set to transparent) but you have set a color. Make sure that cascading of colors keeps the text reasonably legible. 日本語訳→172/5000背景色が設定されていない(またはbackground-colorが透明に設定されている)が、色を設定した。 色の重ね合わせにより、テキストが読みやすくなるようにしてください。 ### 該当のソースコード HTML <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>WCB Cafe</title> <meta name="description" content="ブレンドコーヒーとヘルシーなオーガニックフードを提供するカフェ"> <!--CSS--> <link rel="stylesheet" href="https://unpkg.com/ress/dist/ress.min.css"> <link href="https://fonts.googleapis.com/css?family=Philosopher" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> </head> <body> <header class="page-header"> <h1><a href="index.html"><img class="logo" src="images/logo.svg" alt="WCBカフェホーム"></a></h1> <nav> <ul class=”main-nav”> <li><a href="news.html">News</a></li> <li><a href="menu.html">Nenu</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> </body> </html> CSS @charset "UTF-8"; /*共通部分*/ html{ font-size:100%; } body{ font-family:"Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","ヒラギノ角ゴ Pro W3",sans-serif; line-height:1.7; color:#432; ←ここです!!! } a{ text-decoration:none; } img{ max-width:100%; } /*HEADER*/ .logo{ width:210px; margin-top:14px; } .main-nav { display: flex; font-size: 1.25rem; text-transform: uppercase; margin-top: 34px; list-style: none; } .main-nav li { margin-left: 36px; } .main-nav a { color:#432; ←ここです!!! } .main-nav a:hover { color:#0bd; ←ここです!!! } .page-header{ display: flex; justify-content: space-between; } ```![イメージ説明](b0bc85e2b2cf03a41762245a912ddfbb.png)[![イメージ説明](60e132aafcf3be44966da5ef0f93c1a7.png)] 初歩的な質問で申し訳ありません。 テキスト通りに入力しています。 HTMLは問題ないのですがCSSで3点カラーに関するエラーが出ております。 助けていただきたいです。 よろしくお願い申し上げます。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/08/16 01:59