0

別のファイルにいくつかのcssを含むhtmlページを作成しましたが、正常に機能しました。次に、HTMLにDoctype宣言を追加する必要があることに気付きました。私はそれをしました、そして私のページは完全にめちゃくちゃでした！私はすべてのタイプの宣言を試しましたが、すべて同じになりました!!!

これは私のhtmlです（現在はChromeでのみ機能し、Doctypeはありません）：

<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" type="text/css" href="style.css">
        <title>Luca Rood - Home</title>
    </head>
    <body background="images\background.jpg">
        <div id="header">
            <div id="header-back"></div>
            <div id="top-spacing"></div>
            <div id="content">
                <a href="index.html" title="Luca Rood - Home">
                    <img id="image" src="images\logo.png" alt="Luca Rood">
                </a>
            </div>
        </div>
    </body>
</html>

そしてこれは私のCSSです：

body {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    margin: 0px 0px 0px 0px;
    }

#header {
    position: relative;
    height: 15%;
    }

#header-back {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000000;
    opacity: 0.3;
    z-index:1;
    }

#top-spacing {
    height: 20%;
    width: 100%;
    }

#content {
    position: relative;
    width: 80%;
    height: 60%;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    z-index:2;
    }

#image {
    height: 100%;
    }

助けてください。

前もって感謝します、

ルカ

4

2 に答える 2

1

あなたは古典的なパーセンテージの高さの問題を抱えています。これを修正するには、スタイルに追加し、次の要素にもスタイルを追加するheight:100%必要があります。bodyhtmlheight:100%

<style>
    body{
        /*...*/
        height:100%;
    }
    html{
        height:100%;
    }
</style>

それがうまくいくことを願っています！

于 2013-03-21T01:27:13.420 に答える
-1

上記の<html>タグを試してください

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
于 2013-03-21T01:12:20.967 に答える