ブートストラップはボディカラーを削除しますか？

-2

body{ 
 
    padding: 0; 
 
    margin: 0; 
 
    background-color: #c9ffd6; 
 
} 
 
.wrapper{ 
 
    height: 100vh; 
 
    width: 93%; 
 
    background-color: #a4f4b8; 
 
    margin: 0 auto; 
 
    padding: 0; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title>Felpix | Home</title> 
 
    <meta charset="utf-8"> 
 
    <link type="text/css" rel="stylesheet" href="style.css"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
    <meta name="description" content="Welcome to Felpix Studios, a brand new tech startup making simple, yet helpful apps!"> 
 
    <meta name="keywords" content="Felpix, iOS, Android, apps, games, code"> 
 
    <meta name="author" content="Felpix"> 
 
    <!--Libraries--> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
    <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css"> 
 
</head> 
 
    <body> 
 
    <div class="w3-animate-zoom wrapper"> <!--Page and Animation--> 
 
     <header> 
 
     <div> 
 
      <h1>Felpix Studios</h1> 
 
      <nav> 
 
      <ul> 
 
       <li><a href="#">Home</a></li> 
 
       <li><a href="#"></a></li> 
 
       <li><a href="#"></a></li> 
 
      </ul> 
 
      </nav> 
 
     </div> <!--Header--> 
 
     </header> 
 
    </div> <!--End of Page--> 
 
</body> 
 
</html>

私は私のウェブサイトでそれを使用することができますので、だから私は、ブートストラップのタグを追加します。それに加えて、私もw3cssライブラリを持っています。私のウェブサイトを開くと、体の色は明るい緑色から白色に変わりました...これを修正する方法はありますか？

出典

2017-01-31 GalacticWorld

高さが100vhのwrapperクラスがあり、画面全体を占有します。単にラッパークラスでbackground-colorを取る：

body{ 
    padding: 0; 
    margin: 0; 
    background-color: #c9ffd6; 
} 
.wrapper{ 
    height: 100vh; 
    width: 93%; 
    margin: 0 auto; 
    padding: 0; 
}

それともbodyと同じ色に変更：

body{ 
    padding: 0; 
    margin: 0; 
    background-color: #c9ffd6; 
} 
.wrapper{ 
    height: 100vh; 
    width: 93%; 
    background-color: #c9ffd6; 
    margin: 0 auto; 
    padding: 0; 
}

あなたはまた、それをより多くの特異性を与えるために、身体の背景が!importantであることを指定することができ.wrapper：

body{ 
    padding: 0; 
    margin: 0; 
    background-color: #c9ffd6 !important; 
}

第四のオプションがTに0よりz-index大きく設定することであろう彼の体は、ラッパーの「正面」に現れるようになります。

これは役に立ちます。

出典

2017-01-31 01:27:14

申し訳ありませんが、私が置いた色を維持する方法を探していました...あなたがそれを助けることができれば、多くの感謝！ – GalacticWorld

...ページの高さの100％を占め、背景色を持つ「ラッパー」が必要ですが、その色を全く表示したくない場合や、その色を作成するコードを削除しますか？それで色があっても何がポイントですか？信じられないほど貧弱なプラクティスですが、ボディをラッパーの上に表示させるためには、 'z-index'を使うことが可能です。 –

私はこれをカバーするために私の答えを更新しました。 –

ブートストラップはボディカラーを削除しますか？

答えて

関連する問題