css - header : logo , 标语、图片等方案

Question

我想创建一个这样的模式:

我想知道是否最好为 Logo 和口号创建一个容器..我也想知道是否最好为电话图标、phone1、phone2 和 facebook 按钮创建一个容器..

你能帮帮我吗？

Answer 1

试试这个；

HTML:

<div class="warranty">Warranty image goes here</div>
<div class="logo">LOGO Goes Here</div>
<div class="slogan">Slogan goes here</div>

CSS:

.logo{
    background: #4E41FE;
    color: #FFF;
    padding: 4px 4px;
    text-align: center;
    width: 50%;
    margin: 3px;
}
.slogan{
    background: #4E41FE;
    color: #FFF;
    padding: 4px 4px;
    text-align: center;
    width: 50%;
    margin: 3px;
}
.warranty{
    background: #4E41FE;
    color: #FFF;
    padding: 4px 4px;
    text-align: center;
    width: 40%;
    margin-top: 15px;
    float: right;
}

jsfiddle:http://jsfiddle.net/v4GnU/