0

背景画像である画像が1つあり、ページ全体に広がります

メニューバーもあります（テキストなし）

4 つのテキスト画像ファイル (about、home など) があります。

背景画像の上に配置したい

しかし、そうすると、フルスクリーンでない場合、メニューバーのサイズが変更されます

これが私がこれまでに持っているものです これを行う簡単な方法があれば教えてください

    <html>
    <style> 
     body
     { 
        background: url("http://imageshack.us/a/img84/4772/backgroundnomenutext.png")
                    no-repeat scroll;
        background-size: 100% 100%;
        min-height: 700px; 
     }
    </style>
    </head>
    <body>
     <div style="position:relative">

      <a href="http://www.google.com">
       <img src="http://imageshack.us/a/img835/7200/homefw.png"

        style = "position:absolute; top: 160px; left: 100px;"/>
    </div>
    </body>
    </html>
4

1 に答える 1

0

imgタグにピクセルではなく上と左の値をパーセンテージで指定して、それら（divおよびimg）がアタッチされているように見せるようにしてください。

img
{
  top : /* In percentages */
  left: /* In percentages */
}

このフィドルを確認してください

または固定の幅と高さで行く

このフィドルを確認してください

<html>
 <head>
   <style> 
     body
     { 
        background: url("http://imageshack.us/a/img84/4772/backgroundnomenutext.png")
                no-repeat scroll;
        background-size: 1024px 768px;
        min-height: 700px; 
        max-width:1024px;
        min-width:700px;
     }
     img 
     { 
        position:absolute; 
        top: 180px; 
        left: 300px; 
     }
  </style>
</head>
<body>

 <div>
    <a href="http://www.google.com"  >
       <img src="http://imageshack.us/a/img835/7200/homefw.png"/>
    </a>
 </div>

</body>
</html>​

お役に立てれば..

于 2012-12-04T06:13:41.547 に答える