要实现html文字浮动效果光靠HTML 是不够的还要加上CSS组合一起才行。
要用div float
float语法：
float : none | left |right
float 的基本属性
none：不进行浮动（默认）
left：浮动在其所在的块容器左侧
right：浮动在其所在的块容器右侧
html代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>div css 设定浮动</title>
<style>
/*设定div 的盒子大小*/
div
{
width:120px;
margin:0 0 25px 30px;
padding:15px;
border:1px solid black;
text-align:center;
}
/* 设定 盒子在右边浮动*/
.float-right {
float:right;
}
</style>
</head>
<body>
<div>1</div>
<div class=" float-right">盒子浮动在右边 2</div>
<div>3</div>
</body>
</html>
用代码的方式，给图片上标上文字，小编这里使用定位的方法，将文字定位到想要的任意位置。
1、在body中建立文字信息以及图片内容，也就是在header中包含两个同级，图片和文字。
2、在CSS中对文字图片进行简单样式添加。
3、效果如图所示；大盒子使用描边显示，里面包含了图片和下面的文字。
4、想要将文字弄到画面上去，这时候需要对header添加相对定位，对文字标签p添加绝对定位。
5、对文字添加了绝对定位后，如图效果，然后就需要对其设置下位置关系了。
6、位置关系通常就是top bottom left right 上下左右四个方向了。
7、定位到右上方位置，最后效果就是这样了。
