如何使标题和文本响应

时间:2016-12-13 20:32:57

标签: html css responsive

我的网站上有问题。我已经制作了一个很棒的标题和一些文本,但是对于一些reasin来说,这是在我的网站上没有做出反应的一件事。请帮助伙伴< 3你。

HTML:

   <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <div class="container"> 
       <div class="background"><img src="IMG/Background.jpg">    
         <h1 class="BackgroundText fadeInLeft animated">More than 1000+</br>Templates</h1>
         <a class="Button" href="#1">Templates</a>
       </div>
     </div>

CSS:

.container {
width: 960px;
margin: 0 auto;
}
.background {
margin-top: 0px;
box-shadow: 10px 10px 5px #888888;
width: 100%;
margin-left: -470px;
}
.BackgroundText {
margin-top: -550px;
font-size: 100px;
color: #94c42f;
margin-left: 300px;
}
.Button {
margin-left: 400px;
font-size: 50px;
background-color: #94c42f;
padding: 5px;
border-radius: 10px;
color: #ffffff;
box-shadow: 0px 5px 0px #678920;
}

1 个答案:

答案 0 :(得分:0)

id以使.container响应宽度开始。我将width:960px更改为:

max-width:960px;
width:100%;