2

我想在页面上伸展我的标题,查看下面的图片:

http://gyazo.com/61982a6809817c30f882808ff55972ca.png

我最初计划将横幅放在包装纸中,但现在我改变了主意,希望它直接穿过页面。我不确定我必须输入什么代码才能实现这一点。下面是我的 HTML 和 CSS。

(我知道横幅的质量会受到影响,但我现在不担心)

HTML:

<body>

<div id="wrapper">

 <div id="banner">
           <a href="index.html"><img src="images/banner/banner2.png" width="1000"></a>
 </div>

CSS:

 body {
background-image:url(../images/background/fifa14.jpg);
background-repeat:no-repeat;
    background-attachment:fixed;
 }

#wrapper {
width:1000px;
margin:0 auto;
background-color:#FFF
}

非常感谢!

4

3 回答 3

0

您需要将横幅从包装纸上取下并将其宽度设置为 100%:

将您的 HTML 更改为:

 <body>

 <div id="banner">
     <a href="index.html"><img src="images/banner/banner2.png" width="1000"></a>
 </div>

 <div id="wrapper">

将此添加到您的 CSS 中:

#banner img {width:100%} 
于 2013-09-06T10:25:51.203 回答
0

尝试将#wrapper 宽度设置为 100% ,您的意思是要将图像设置为全屏交叉吗?

以及图像宽度。

如果有帮助,谢谢希望。

于 2013-09-06T10:26:31.533 回答
0

这是一个例子点击这里

HTML

 <body>
    <div id="wrapper">
        <a href="index.html">
            <div id="banner"></div>
        </a>      
    </div>       
 </body>

CSS

 body{background-color:slategray;margin:0;}

 #banner{    
    background: red;
    width:100%;
    height:100px;
    border-bottom:2px solid gold;
 }
于 2013-09-06T10:37:46.197 回答