CSSのエラーが見つけられません、助けてください。

前提

ここに質問の内容を詳しく書いてください。
（例）
HTML CSS　の模写コーディングをしています。
CSSのエラーが消せなくて困っています。

実現したいこと

エラーを消す。


```HTML
コード

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"/> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>課題テンプレ</title> <link rel="stylesheet" href="css/style.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inview/1.0.0/jquery.inview.min.js"></script> <script src="js/script.js"></script> </head> <body> <header id="header"> <div class="logo"> <h1 class="title">CCC</h1> <span>英会話スクール</span> </div> </header> <main> <div id="mainvisual">

    <ul class="fade">
        <li><img src="../web3/img/mainvisual1.jpg" alt="main1"></li> 
       <li><img src="../web3/img/mainvisual2.jpg"alt="main2"></li> 
       <li><img src="../web3/img/mainvisual3.jpg " alt="main3"></li> 
    </ul>
    <div class="text">
        <P>話して学ぼう<br> CCC英会話スクール
        </P>
        <p><a class="btn" href="#">無料体験はこちらから </a></p>
    </div>
    </div>
    <section id="reason"></section>
    <section id="voice"></section>
    <section id="summary"></section>
    <div　id="entry"></div>
</main>
<footer></footer>

</body> </html>

CSS
1コード
2```*{
3    margin:0;
4    padding:0;
5}
6.logo{
7    color: red;
8    vertical-align: bottom;
9}
10.title{
11    vertical-align: bottom;
12    font-size: 40px;
13    font-weight: 600;
14}
15.logo span{
16    vertical-align: bottom;
17    font-size: 15px;
18}
19#mainvisual{
20    height: 720px;
21    position: relative;
22    margin-bottom: 120px;
23}
24.text{
25    position: absolute;
26    top: 280px;
27    left: 10%;
28    z-index: 10;
29  }
30  .text p {
31        font:-size: 30px;
32        font-weight: bold;
33        margin-bottom: 30px;
34        text-shadow: 0 4px 6px #fff;
35    }
36.fade{
37        height: 300px;
38        margin-top: 10px;
39        position: relative;
40    }
41    .fade li {
42        width: 75%;
43        position: absolute;
44        top: 0;
45        right: 0;
46        /* 最初は3枚の画像を非表示にしておく */
47        opacity: 0;
48        animation: fade 1s infinite;
49    }
50    .fade li:nth-child(1) {
51        animation-delay: 0s;
52      }
53      .fade li:nth-child(2) {
54        animation-delay: 2s;
55      }
56      .fade li:nth-child(3) {
57        animation-delay: 2s;
58      }
59.text p{
60    font-size: 25px;
61    font-weight: 500;
62    text-shadow: 0 4px 6px #fff;
63    margin-bottom: 30px;
64   
65}
66
67.btn{
68    width: 820px;
69    text-align: center;
70    margin: 0 auto;
71    background-color: red;
72    color: white;
73    padding: 15px;
74    border-bottom: 6px solid #9a0413;
75    border-radius: 10px;
76    text-decoration: none;
77}
78
79
80
81
82
83   /* スマホ時 */
84@media screen and ( max-width:640px )
85{
86
87
88
89}

norando

2022/07/14 12:24

cssのエラーというのは, どこにどのようなものが出ているのでしょうか？

行動規範の内容に同意します

回答1件

ベストアンサー

下記の idの前が全角スペースなので半角スペースに修正。

html
1    <div　id="entry"></div>
2</main>

下記の font:-size:をfont-size:に修正。

css
1  .text p {
2        font:-size: 30px;
3        font-weight: bold;
4        margin-bottom: 30px;
5        text-shadow: 0 4px 6px #fff;
6    }

プログラミング用エディターを使うと間違い個所を指摘してくれますので、お勧めします。
例えば、Visual Studio Code とか。

投稿2022/07/14 12:30

編集2022/07/15 01:42

hatena19

総合スコア33715

y-sasaki

2022/07/15 01:24

font:-size: の部分が間違えてました。ありがとうございます。

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

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

ただいまの回答率
85.48%

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

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

質問する

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

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

CSSのエラーが見つけられません、助けてください。

前提

実現したいこと

関連した質問