<body>
<div class="sts-viewport-fill">
<nav role="navigation" class="nav navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button data-toggle="collapse" data-target=".navbar-collapse" type="button" class="navbar-toggle">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">Knonet</span>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href=#>Log In</a></li>
<li><a href=#>Sign Up</a></li>
<li><a href=#>Help</a></li>
</ul>
</div>
</div>
</nav>
<div class="container-fluid">
<h1 class="text-center">CONNECT WITH EVERYONE.<br>
<small>Knonet aims to connect the whole world with the Internet.</small>
</h1>
</div>
</div>
<div class="container sts-second-slide">
Salut, et Bonjour!
</div>
</body>
私のHTMLがあります。私はそうのようなCSSルールの束を適用した:テキストが表示されない
body {
font-family: 'Source Sans Pro', 'Segoe UI Light', sans-serif;
font-weight: initial;
font-weight: 100;
}
.sts-viewport-fill {
position: absolute;
top:0;right:0;bottom:0;left:0;
background-color: #000000;
color: #ffffff;
}
.sts-viewport-fill .container-fluid h1 {
margin: 250px auto 100px auto;
font-weight: 900;
}
.navbar-collapse, nav [type="button"] {
border: none !important;
border-radius: 0%;
}
.sts-second-slide {
margin-top: 100px;
}
は私に関する限り、これはdiv.sts-viewport-fill
は、画面のビューポート全体に合うようになり、またはそれを残って、少なくとも何。
問題がありますか?そこにフランス語をみんな? Salut、et Bonjour!? ブラウザに表示されません。お守り:
誰かがここで1を何が起こっているのかを教えてもらえますか?私は本当に強い気持ちを持っています。これは、position: absolute;
とtop:0;bottom:0;
のルールと関係があります。
Merci d'Avance!
PS:color: #fff;
属性を.sts-second-slide
セレクタに適用しても、結果はまだ得られません。
を試してみてください。 Tyに '.sts-second-slide {color:#ffffff; z-インデックス:1000; } 'それを前面に持ってきて白くする。 – C14L