0

これは私が使用しているコーディングです。私は何時間もそれをいじっています。以下は私が使用しているCSSです

<ul class="slider">
  <li style="display: block;">
    <a href="#" style="clear:both;>
       <div class="slider_blog" style="width: 680px; height: 300px; display: block; clear: both; float: left;">
         <div class="slider_blog_img">
           <img src="#" alt="#">
         </div>
         <div class="slider_blog_text" style="float:left;">
           <h2>This is A Title</h2>
           <p></p>
           <p>words</p>
        </div>
      </div>
    </a>
  </li>
</ul>

これが私が使用しているCSSです

.slider li {
  display: none, block;
  position: absolute; 
  top: 0; 
  left: 0; 
  list-style: none;
  padding:0;
  margin:0px;
  width:680px;
  height:300px;
}

.slider li:after{
  clear:both;
}

.slider_blog{
  border: 1px solid #F0E; clear: both; padding: 0; margin: 0;
}

.slider_blog a{
 text-decoration: none; padding: 0; margin: 0;
}

.slider_blog_img{
  width:300px;
  height:300px;
}

.slider_blog img{
  width: 200px; height: 200px; margin:50px; border: none; display:block;
}

.slider_blog_text{
 width: 280px; padding: 50px 20px 50px 0px; border:none;
}

.slider_blog_text h2{
 text-align:center; font-size:24px; font-weight:bold; color:red; 
}

.slider_blog_text p{
  text-align:justify; font-size:14px; color:green;
}

CSSで追加されたインラインのものであることは知っていますが、これは、私が進歩していたときにFirebugからコピーされたものです。助けてくれてありがとう。

4

2 に答える 2

0

最初の<a>タグに末尾のスタイルの引用がありません。最初にそれを修正してから、問題をよりよく説明してください。float:leftまた、クラスに aを追加し.slider_blog_img、設定された幅と高さを今のところ削除してみてください。

于 2013-01-12T06:19:47.223 に答える
0

TJohnWieの指示に従ってください

終わりの引用を提供する

<a href="#" style="clear:both;">

そしてこれを使う

.slider_blog_img {
    float: left;
}

出力

于 2013-01-12T06:24:43.440 に答える