0

私はhtml/cssが初めてで、いくつかのチュートリアルを行い、単純なボックスを追加しようとしました. テキストは表示されますが、その周りのボックスは表示されません。

これは私のcssです

body
{

background: #6a6a6a;    
background-image:  -moz-linear-gradient(top,  #6a6a6a 0%, #353535 100%);
background-image:  -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6a6a6a), color-stop(100%,#353535));
background-image:  -webkit-linear-gradient(top,  #6a6a6a 0%,#353535 100%);
background-image:  -o-linear-gradient(top,  #6a6a6a 0%,#353535 100%);
background-image:  -ms-linear-gradient(top,  #6a6a6a 0%,#353535 100%);
background-image:  linear-gradient(to bottom,  #6a6a6a 0%,#353535 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6a6a6a', endColorstr='#353535',GradientType=0 );

background-size: auto;
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;





.box
{
  background: #fff;
  border: 6px solid #ccc;
  height: 100px;
  margin: 20px;
  padding: 20px;
  width: 400px;
}

}

これは私のhtmlです

<!DOCTYPE html>

<html>

<head>
    <title>Where do you want to go?</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <link type="text/css" href="css/style.css" rel="stylesheet" />
</head>

<body>

<div class="box"> why doesn't this show up? </div>

</body>

</html>

「なぜこれがボックスに表示されないのか、ボックスに表示されないのはなぜですか。

4

3 に答える 3

0
  1. css が別のフォルダーにある場合は、どこにあるのかを更新してくださいhref

  2. このパターンを試してください

    body{
}
.box{
}
于 2013-07-06T08:51:38.003 に答える
0

CSS はネストされていません。一緒に何かを書くのはあなたの直感かもしれませんが：

#id {
    color: red;

    .box {
        border: 6px solid #ccc;
    }
}

無効です。やや面倒なことをしなければなりません:

#id {
    color: red;
}

#id.box {
   border: 6px solid #ccc;
}

これが、SASS または LESS も検索することをお勧めする理由です。

于 2013-07-06T08:52:27.130 に答える
0

css ファイルでは、#box ではなく .box を実行します。 #boxあなたは質問を編集したばかりなのでid="box"、 これは無効です.boxclass="box"

ああ、問題が見つかりました。ボディから .box{} を取り出します。{}

于 2013-07-06T08:42:29.820 に答える