如何让文字环绕图片,而且要自动换行?????

2008-09-11 15:38:51 by 【6yang】, 194 visits, 收藏 | 返回

style="float:right;clear:left"  
   
  float   :   none   |   left   |right    
     
  参数说明:    
  none   :    对象不浮动  
  left   :    对象浮在左边  
  right   :    对象浮在右边    
   
  clear   :   none   |   left   |right   |   both    
  参数说明:    
  none   :    允许两边都可以有浮动对象  
  both   :    不允许有浮动对象  
  left   :    不允许左边有浮动对象  
  right   :    不允许右边有浮动对象

 

 

楼主是不是想做出杂志里的那种图文混排的形式,看下我的提问:  
  http://www.blueidea.com/bbs/newsdetail.asp?id=1879239&posts=currentposts  
   
  代码如下:  
   
  <!DOCTYPE   html   PUBLIC   "-//W3C//DTD   XHTML   1.0   Strict//EN"    
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  <html   xmlns="http://www.w3.org/1999/xhtml"   xml:lang="en"   lang="en">  
  <head>  
  <meta   http-equiv="content-type"   content="text/html;   charset=gb2312"   />  
  <title>  
  Cross-Column   Pull-Out:   Example   7  
  </title>  
   
  <style   type="text/css">  
  body{  
          font:12px   宋体;  
          }  
  p{  
          text-indent:20px;  
  color:#3366cc;  
  line-height:18px;  
   
  }  
  #main{  
          width:780px;  
  margin:0   auto;  
  }  
  .cols{  
          margin:5px;  
          width:240px;  
  float:left;  
  }  
  .side{  
          width:110px;  
  height:210px;  
          float:right;  
  padding:5px;  
  }  
  .side2{  
   
          width:60px;  
  height:210px;  
  float:left;  
  padding:5px;  
  }  
  .center{  
          margin-left:-110px;  
          width:360px;  
  height:210px;  
  float:left;  
  padding:5px;  
   
  display:block;  
  }  
  .center   span{  
          position:absolute;  
  width:200px;  
  }  
   
  </style>  
  </HEAD>  
   
  <BODY>  
  <div   id="main">  
  <div   class="cols">  
  <p>随着中间件技术和网络技术的进一步发展,采用基于中间件的开发方法,通过对特定应用领域的分析、建模和可重用中间件的设计,基于底层的支持(包括裸机、网络基础设施、传统的系统软件、网络软件以及系统软件开发商提供的开发和运行环境等)搭建针对特定行业应用的应用支撑平台和基础设施,是进  
  <div   class="side"></div>  
  一步发展的方向。基于特定行业应用支撑平台上的应用系统的建设变成了客户端的可视化的配置管理(可视化配置工具由行业应用平台提供),应用的系统的建设变得轻松容易。</p>  
   
  <p>企业应用支撑平台是面向企业应用层提供所需的各种通用服务和关键服务的基础组件层。支撑技术主要为企业应用解决如下共性和关键的问题:    
   
  资源共享:资源包括数据资源和数据处理资源。    
  信息交换:不同的用户和系统之间在语义层上的信息互通。涉及信息表示、消息和信息格式等。    
  业务访问:指业务系统功能能够被使用或访问。涉及业务功能的描述、发布和访问等。    
  业务集成:指整合不同的业务系统,实现业务综合处理。涉及流程控制、事务处理等。    
  安全可信:解决资源共享、信息交换、业务访问和业务集成中的安全可信问题。    
  可管理:资源和处理的可管理问题。   </p>  
  <p>随着中间件技术和网络技术的进一步发展,采用基于中间件的开发方法,通过对特定应用领域的分析、建模和可重用中间件的设计,基于底层的支持(包括裸机、网络基础设施、传统的系统软件、网络软件以及系统软件开发商提供的开发和运行环境等)   </p>  
    <p>this   is   the   table   for   ocntent</p>  
    </div>  
  <div   class="cols">  
  <p>搭建针对特定行业应用的应用支撑平台和基础设施,是进一步发展的方向。基于特定行业应用支撑平台上的应用系统的建设变成了客户端的可视化的配置管理(可视化配置工具由行业应用平台提供),应用的系统的建设变得轻松容易。</p>  
  <div   class="center">  
  <span>  
  <img   src="graph.gif"   width="410px"   alt="******"   />  
  this   is   the   figure  
  </span>  
  </div>  
  <p>随着中间件技术和网络技术的进一步发展,采用基于中间件的开发方法,通过对特定应用领域的分析、建模和可重用中间件的设计,基于底层的支持   (包括裸机、网络基础设施、传统的系统软件、网络软件以及系统软件开发商提供的开发和运行环境等)搭建针对特定行业应用的应用支撑平台和基础设施,是进一步发展的方向。基于特定行业应用支撑平台上的应用系统的建设变成了客户端的可视化的配置管理(可视化配置工具由行业应用平台提供),应用的系统的建设变得轻松容易。</p>  
  <p>  
  技术模型、管理模型、功能模型层:是企业应用的基础支撑层,包括应用系统开发、部署、运行和管理的环境及其相应规范。根据应用系统支撑平台技术的发展过程和技术特征,基础架构可以分为面向过程的、基于组件的和面向服务的三种不同类型的技术架色。基础架构一般表现为一组技术规范、符合规范的程序、程序模块和组件。企业应用系统可能由一类或几类基础架构来构建;各类基础架构也都可以为上层应用系统提供所需的共性服务。    
  随着中间件技术和网络技术的进一步发展,采用基于中间件的开发方法,通过对特定应用领域的分析、建模和可重用中间件的设计,基于底层的支持(包括裸机、网络基础设施、传统的系统软件、网络软件以及系统软件开发商提供的开发和运行环境等)   搭建针对特定行业应用的应用支撑平台和基础设施,是进一步发展的方向。基于特定行业应用支撑平台上的应用系统的建设变成了客户端的可视化的配置管理(可视化配置工具由行业应用平台提供),应用的系统的建设变得轻松容易。<p>  
  </div>  
  <div   class="cols">  
  <p>  
  随着中间件技术和网络技术的进一步发展,采用基于中间件的开发方法,通过对特定应用领域的分析、建模和可重用中间件的设计,基于底层的支持   (包括裸机、网络基础设施、传统的系统软件、网络软件以及系统软件开发商提供的开发和运行环境等)搭建针对特定行业应用的应用支撑平台和基础设施,是  
  <div   class="side2"></div>  
  进一步发展的方向。基于特定行业应用支撑平台上的应用系统的建设变成了客户端的可视化的配置管理(可视化配置工具由行业应用平台提供),应用的系统的建设变得轻松容易。</p>  
  <p>技术模型、管理模型、功能模型层:     this   is   the   table   for   ocntent   是企业应用的基础支撑层,包括应用系统开发、部署、运行和管理的环境及其相应规范。根据应用系统支撑平台技术的发展过程和技术特征,基础架构可以分为面向过程的、基于组件的和面向服务的三种不同类型的技术架色。基础架构一般表现为一组技术规范、符合规范的程序、程序模块和组件。企业应用系统可能由一类或几类基础架构来构建;各类基础架构也都可以为上层应用系统提供所需的共性服务。   </p>  
  </div>  
  </div>  
  </BODY>  
  </HTML>

分享到:
share

    图片原图

    loading

    loading