繁體中文当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > CSS解决文字环绕图片问题
- CSS样式表
- CSS网页布局中文排版的9则技巧
- 剖析网站的布局实例以及如何对其黄金分割
- Float菜单水平居中简单方法
- CSS网页制作教程:网页中常用的web安全字体
- CSS网页制作教程:字体单位em简介
- CSS网页制作:浮动清除的新方法
- 收集分享的3个讲解css及标签的视频
- CSS网页制作技巧:节约网页代码编写时间
- 收集的6个关注CSS3的国外网站
- CSS实例教程:reflow
- CSS教程:需要知道的CSS3动画技术
- 快速实时编辑网页代码的FireFOX和IE插件
- 在IE6,IE7下变通实现pre-wrap
- CSS圆角框进行JS封装
- CSS教程:Mozilla建议的css书写顺序
- 基于链接关系的微格式:使用rel属性
- 非常酷的微格式：XFN规范
- 为网页内容添加结构和语义的hAtom微格式
- 网页简历结构和语义信息:hResume微格式
- hCalendar微格式:关于事件和基于时间或地点的活动
CSS样式表 中的 CSS解决文字环绕图片问题
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-09 浏览: 55 ::
收藏到网摘: n/a
上图是美工为一站点制作的图文并茂的新闻标题列表，采用表格进行布局，右上和下部分分布在两个单元格中，程序实现起来可不太容易：要么分两次查询，一次取4条，一次取5条；要么一次取出9条，再分在两个单元格中显示。能不能通过设置图片的属性，让文字和图片像Word中一样可以四周环绕对齐？这样程序就不用理会图片，只负责一次读取显示就可以了。经测试将图片的float属性设置为left可解决我们的问题，效果如下图：
| dnawo<div align="left"><img src="pic/20070404/014.jpg" width="91" height="84" style="float:left;" /> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表 </div> |
评论 (0) All
