ヘッダーの背景イメージをブラウザーの高さの100%に拡張しようとしても動作しません。大きな壁紙ですが、bg画像はちょうど小さな棒ですが、私の間違いが見えますか?HMTL/CSS:ヘッダーのBGイメージをブラウザの高さの100%にする
@font-face { /* ERSTENS LADE font family rein*/
font-family: 'alex_brushregular';
src: url('../css/alexbrush-regular-webfont.eot');
src: url('../css/alexbrush-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../css/alexbrush-regular-webfont.woff2') format('woff2'),
url('../css/alexbrush-regular-webfont.woff') format('woff'),
url('../css/alexbrush-regular-webfont.ttf') format('truetype'),
url('../css/alexbrush-regular-webfont.svg#alex_brushregular') format('svg');
font-weight: normal;
font-style: normal;
}
:<head>
<meta charset="UTF-8">
<title>TEXT</title>
<meta name="description" content="text">
<meta name="keywords" content="text" >
<meta http-equiv="expires" content="0">
<link rel="stylesheet" href="css/stylesheet.css">
</head>
<body>
<header>
<h1>TEXT <br> <span>TEXT</span></h1>
</header>
<section>
<article>
<p>TEXT</p>
<img src="images/spachtel1.jpg"><br>
<img src="images/spachtel1.jpg"><br><br>
</article>
</section>
<footer>
<h3>text<br>
</footer>
</body>
ここ
は、CSSファイルです:;(そのコードの意味を判断いけないしてください、そのちょうどHTML/CSSを実施するための)HTMLファイルのthats
html {
font-size: 1rem;
}
html {
height: 100%;
}
body {
min-height: 100%;
margin: 0;
padding: 0;
}
h1 { /
font-family: 'alex_brushregular', 'sans-serif';
}
section p {
font-weight: 100;
font-size: 1.13rem;
font-style: italic;
}
span.by {
color: red;
}
section a {
color: #eda318;
text-decoration: none;
font-style: normal;
}
section a:hover {
text-decoration: underline;
}
header {
background-image: url('../images/bgheader1.jpg');
background-position: 50% 50%;
background-size: cover;
}
最初の回答Stackoverflow!驚くばかり。 1つの推奨は、あなたの推薦が意味するもののコードサンプルを提供することによって、あなたの答えを改善することです。例えばCSSコードで 'header {...}'を 'body { background-image:url( '../ images/bgheader1.jpg');に置き換えてください。 バックグラウンドポジション:50%50%; background-size:cover; } '画像をウェブページ全体に渡って表示したい場合。 – zipzit
があり、ページ全体に画像が表示されます。私が望むのは、「着陸ページ」全体をカバーする画像です。スクロールすると、残りの部分が(背景画像なしで)表示されます。これはヘッダーにイメージを置くべきだと思うことを意味しますが、何が間違っているのでしょうか?例:http:// domanistudios。com/ – Richi888