麻烦代码标签?

时间:2014-06-22 19:31:48

标签: html css html5 css3 tabs

我有一个新会员...... 我有一个无法解决的Web编程问题。 我有任何标签的问题代码都没有...

http://8pic.ir/images/mrghe6ey1a8wkbxjefzw.png

现在我自己的标签。 HTML代码和Style和我进入了图片。但我确实想要Mote ...... 现在我要输入的HTML代码和样式如上所示:

此错误检查代码来自? 这些代码与标签有关。

http://Trainbit.com/files/1222191884/Tabs_Style_amp_HTML.txt

HTML:

<div class="list-wrap">
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
                    </div>
                    <div class="text-slider">
                    <a href="#">Permalink to Post With Featured</a>
                    <br/>
                    2014 17 June
                    </div>                   
</div>
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
                    </div>
                    <div class="text-slider">
                    <a href="#">Permalink to Post With Featured</a>
                    <br/>
                    2014 17 June
                    </div>                   
</div>
</div>
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
                    </div>
                    <div class="text-slider">
                    <a href="#">Permalink to Post With Featured</a>
                    <br/>
                    2014 17 June
                    </div>                   
</div>
</div>

CSS:

.img-box{
    width:89px;
    height:89px;
    margin:10px 10px;
    float:left;
    padding-left:-5px;
    }
.img-box img{
    width:89px;
    height:89px;
    float:left;
    }
.text-slider{
    margin:10px;
    font-size:11px;
    float:right;
    }
.post-list a{
    text-decoration:none;
    font-size:13px;
    color:#7b7c7c;
    float:right;
    }
.text-slider a:hover{
    color:#54d5d5;
    }

谢谢,我会提交答案:)

1 个答案:

答案 0 :(得分:0)

我想我已经解决了你的问题。您必须指定<div>的宽度和高度才能按照您希望的方式工作。请参阅:http://jsfiddle.net/P6gkx/

HTML:

<div class="list-wrap">
    <div class="post-list">
        <div class="img-box">
            <img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
        </div>
        <div class="text-slider"> <a href="#">Permalink to Post With Featured</a>

            <br/>2014 17 June</div>
    </div>
    <div class="post-list">
        <div class="img-box">
            <img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
        </div>
        <div class="text-slider"> <a href="#">Permalink to Post With Featured</a>

            <br/>2014 17 June</div>
    </div>
</div>
<div class="post-list">
    <div class="img-box">
        <img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
    </div>
    <div class="text-slider"> <a href="#">Permalink to Post With Featured</a>

        <br/>2014 17 June</div>
</div>
</div>

CSS:

.img-box {
    width:89px;
    height:89px;
    margin:10px 10px;
    float:left;
    padding-left:-5px;
}
.img-box img {
    width:89px;
    height:89px;
    float:left;
}
.text-slider {
    margin:10px;
    font-size:11px;
    float:left;
}
.post-list a {
    text-decoration:none;
    font-size:13px;
    color:#7b7c7c;
    float:left;
}
.text-slider a:hover {
    color:#54d5d5;
}

.post-list{
    width:310px;
    display:block;
    height:120px;
    background-color:#ddd;
    margin-bottom:5px;
}