1

我创建了一个设计,如下所示

http://jsfiddle.net/g9TT7/1/

我想把标志的意思放在页面的顶部和左侧下方

<a href="index.html"  style="margin-top:10px;position:relative!important;width:200px;display:block;" class="img1">
<img src="image/img_2.png" alt="logo" />
</a>

在这里,我想将企业名称放在页面的中心,徽标将在页面的左侧。我在我的徽标中设置了绝对位置,但没有工作。请帮助我做到这一点。

4

3 回答 3

0

像这样的东西?http://jsfiddle.net/ADDTn/

<div class="header">
    <a href="#" class="logo">
        <img src="img.jpg" />
    </a>
    <h1>Bussiness</h1>
    <div class="clear"></div>
</div>

css

.header {
    width: 100%;
    height: 100px;
}

.logo {
    display: block;
    float: left;
}

h1 {
    text-align: center;
}

.clear {
    clear: both;
}
于 2013-10-02T08:04:11.363 回答
0

我希望你想要这样的东西:

演示

在您的徽标样式中添加 css float:left 并从业务 div 中删除绝对位置。您还可以通过使用边距从顶部和左侧调整位置。

HTML:

<div class="b" style="text-align:center;">      

        <a href="index.html" class="img1">
                <img src="image/img_2.png" alt="logo" />
        </a>

        <div class="business_name" >
                            Business
        </div>
        <div class="clear"></div>
</div>

CSS:

.clear
{
    clear:both;
}
.img1{
    margin-top:20px;
    width:200px;
    display:block;
    float:left;
}
.business_name {
    width: 78%;
    font-size: 43px;
    font-weight: bold;
    float: left;
    text-align: center;
    line-height: 28px;
    margin-top: 5px;
}

.b {
    font-size: 25px;
    font-weight: bold;
    width: 78.5%;
    text-align: left;
    height: 50px;
    margin: 0px;
    color: rgb(67, 161, 240);
}
.img1 {
    float: left;
    margin: 2px 0px 0px;
    width: 20%;
    text-align: left;
    border: 0px solid red;
}
于 2013-10-02T08:12:50.163 回答
0

分配 z-index 值

<a href="index.html"  style="margin-top:10px;position:relative!important;width:200px;display:block; z-index: 1;" class="img1">
<img src="image/img_2.png" alt="logo" />
</a>

看这个演示

于 2013-10-02T08:04:30.687 回答