0

簡単に言うと、ヘッダー クラスは画面全体に黒い線で表示する必要があります。HTML ではリストになります。リストの子はボタンとしてスタイル設定され、ページの最初の 20% の後に開始する必要があります。どこかで、これはひどく間違っています。理由は次のとおりです。

  1. リストの子はまったくスタイルされていません (マージン)

  2. ページ自体がかなり伸びます。

ソースコード全体は次のとおりです。

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
    html, body {
         padding: 0;
         background-color:#FFFCF2;
         margin: 0 auto;
         }

        .header {
          list-style:none;  
        width:100%;
        height:65px;
        font-size:3%;   
        background: black;
         }

        .header:first-child {
        margin-left:20%;
        }

    .headerChild {
        margin-left:0;
        float:left;
         height:65px;
         width:10%;
         background: white;
    }   
    </style>
</head>
<body>
         <ul class="header">
        <li class="headerChild"></li>
        <li class="headerChild"></li>
        <li class="headerChild"></li>
        </ul>
</body>
</html>
4

2 に答える 2

1

CSS を次のように置き換えます。

html, body {
     padding: 0;
     background-color:#FFFCF2;
     margin: 0 auto;
}

.header {
    list-style:none;  
    width:100%;
    height:65px;
    font-size:3%;   
    background: black;
    padding-left: 20%;
}

.header:first-child {       
}

.headerChild {
    margin-left:0;
    float:left;
     height:65px;
     width:10%;
     background: white;      
}
于 2013-07-05T16:27:38.420 に答える