分类： Html/Css
2014-04-18 22:14:09
文字环绕是Microsoft Office Word软件的一种排版方式，主要用于设置Word文档中的图片、文本框、自选图形、剪贴画、艺术字等对象与文字之间的位置关系。一般包括四周型、紧密型、衬于文字下方、浮于文字上方、上下型、穿越型等多种文字环绕方式。
但我们做网页布局时，有时也需要这样的样式，那么怎么办呢？其实是很简单的，主要就是float的使用，具体请看下面例子：
HTML部分：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
前端开发工程师是一个很新的职业，在国内乃至国际上真正开始受到重视的时间不超过5
年，是指Web前端开发工程师的简称。 Web前端开发是从美工演变而来的，名称上有很明显的时代特征。
在互联网的演化进程中，Web 1.0时代，
网站的主要内容都是静态的，用户使用网站的行为也以浏览为主2005年以后，互联网进入Web 2.0时代，
各种类似桌面软件的Web应用大量涌现，网站的前端由此发生了翻天覆地的变化。网页不再只是承载单一
的文字和图片，各种富媒体让网页的内容更加生动，网页上软件化的交互形式为用户提供了更好的使用体验，
这些都是基于前端技术实现的。
随着Web 2.0概念的普及和W3C组织的推广，网站重构的影响力正以惊人的速度增长。XHTML+CSS布局、DHTML
和Ajax像一阵旋风，铺天盖地席卷而来，包括新浪、搜狐、网易、腾讯、淘宝等在内的各种规模的IT企业都对自己的
网站进行了重构。
|
CSS部分：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
|
* {
margin: 0;
padding: 0;
}
.txt {
margin: 50px auto;
width: 500px;
padding: 10px;
border: 1px solid #ccc;
font: 14px/20px "Microsoft YaHei";
color: #666;
}
.txt p {
text-indent: 20px;
}
.txt img {
float: left;
width: 180px;
height: 110px;
margin: 5px 10px 0 0;
}
|
