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>标签缺少结尾样式引用。尝试先解决这个问题,然后更好地解释问题。另外,请尝试将 a 添加float:left.slider_blog_img类中并暂时删除设置的宽度和高度。

于 2013-01-12T06:19:47.223 回答
0

TJohnW按照ie的指示做好

提供结束报价

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

并使用它

.slider_blog_img {
    float: left;
}

输出

于 2013-01-12T06:24:43.440 回答