时间:2021-07-01 10:21:17 帮助过:38人阅读
1.
<HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> </HEAD> <BODY> <img src="D:\用户目录\Pictures\IQIYISnapShot\1491055341(1).png" style="float:left;"></img>你的文字多的话,图片在右上角显示,图片的右边和下边被文字包围。 </BODY> </HTML>
2.
<HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> </HEAD> <BODY> <p style="position:relative;"> <img src="D:\用户目录\Pictures\IQIYISnapShot\1491055341(1).png" /> <p style="position:absolute; z-index:2; left:600px; top:10px"> 你的文字多的话,图片在左边显示,文字在右边显示。 </p> </p> </BODY> </HTML>
3.
<HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <style> p.wrap-p-topSpacer { width: 0px; height: 60px; float: left; } p.wrap-p { float: left; clear: both; margin: 0px 10px 0 0; <!--height: 80px;--> <!--width: 25%;--> text-align: center; background: #0088cc; color: #FFF; } p.wrap-p-right { float: right; width: 50%; } </style> </HEAD> <BODY> <p class="wrap-p-topSpacer"></p> <p class="wrap-p"><img src="D:\用户目录\Pictures\IQIYISnapShot\1491055341(1).png" /> </p> <p>你的文字多的话,图片在左偏上部位,图片的上右下都被文字包围,形成三面环绕效果。 </p> <p class="wrap-p-topSpacer"></p> <!-- <p class="wrap-p wrap-p-right"> 你的另一张图片效果</p>--> <p>你的另一部分文字。。。。. </p> </BODY> </HTML>
以上就是字体围绕图片效果的html代码的详细内容,更多请关注Gxl网其它相关文章!