0
我尽力使代码像但成功。 我不知道如何做到这一点绿色按钮,在同一时间有白色+加里边界。必须有两个背景之间的距离,我没有它。 另外我不知道我是如何把代码是正确的。有人请给我一个手。bootstrap和CSS的帮助像在图像
HTML:
.vous-voulez {
background-color: #DFE3E4;
}
.vous-voulez-button {
background-color: #DFE3E4;
margin: 10px;
}
.recherche {
background-color: #DFE3E4;
margin: 10px;
}
.text-p,
.vous-voulez {
margin-top: 40px;
}
<div class="vous-voulez ">
<div class="row">
<div class="vous-voulez-button col-sm-6">
<h4>Vous voulez vendre votre bien rapidement?</h4>
<button type="button" class="btn btn-success btn-block">Cliquez ici pour une annonce gratuitement!</button>
</div>
<div class="recherche col-sm-6">
<h4>Recherche par numero de telephone</h4>
<form>
<div class="row">
<div class="col-sm-9">
<input type="text" class="form-control" id="usr" />
</div>
<div class="col-sm-3">
<button type="button" class="btn btn-default active">CHERCHER</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="text-p">
<div class="row">
<div class="col-sm-6">
<div class="row">
<div class="col-sm-9">
<p>Cliquez sur l'une des icones suivantes pour masquer la recherche</p>
</div>
<div class="col-sm-3">
<button type="button" class="btn btn-default active"><span class="glyphicon glyphicon-arrow-down" aria-hidden="false"></span>
</button>
<button type="button" class="btn btn-default active"><span class="glyphicon glyphicon-arrow-down" aria-hidden="true"></span>
</button>
<button type="button" class="btn btn-default active"><span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span>
</button>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="row">
<div class="col-sm-9">
<p>Aimeriez-vous promouvoir votre actiuvite ou produit? <a href="#">Consultez nos tarifs</a>
</div>
</div>
</div>
</div>
</div>
这工作不错。你能帮我一下箱子之间的距离吗?我不知道如何制作这个空间(灰色背景下的两个) –
它非常简单,因为您需要与箱形阴影和边框宽度同样地进行调整......以使箱子之间有距离。谢谢! – vignesh