图片浮动时不让文字内容环绕到图片下方代码,Css代码库,德仔网

代码语言

代码分类

【Css】图片浮动时不让文字内容环绕到图片下方

作者:Dezai.CN / 发布于2013/1/29/ 482

类似左侧图片右侧文字的排版方式我们经常能够见到，但是，有许多网友都遇到过一个问题：在图片浮动到一侧时，超出图片高度的文字往往会环绕到图片的下方。

<style type="text/css">
  
.callout {
    border:1px solid #000;
    float:left;
    width:275px;
}
  
.callout h3 {
    width:115px;
    height:65px;
    float:left;
    text-indent:-8008px;
    background:transparent url(team-report.gif) no-repeat 0 0;
}
  
.callout * {
    width:160px;
    float:right;
}
  
.callout * * {
    width:auto;
    float:none;
}
  
</style>


<div class="callout">
    <h3>team report graphic, replaced image</h3>
    <h2>Team Report 10-06-05</h2>
  
    <ul>
        <li>An <a href="#">anchor tag</a> perhaps?</li>
        <li>Or a <strong>strong tag</strong> perhaps?</li>
    </ul>
  
    Here's a paragraph too!
</div>

试试其它关键字

　图片浮动　

同语言下

可能有用的

Dezai.CN贡献的其它代码(4037)