用html如何实现文字环绕图片

html-css09

用html如何实现文字环绕图片,第1张

添加环绕代码即可,代码如下:

<style>

   p {border:1px solid red}

   img {float:leftmargin:0 5px 5px 0}

</style>

操作步骤如下:

1、首先准备好html文件和所需要插入的图片,将其放在同一个文件夹内;

2、然后在html文件中编辑要显示的页面内容和图片,先将整体的大概页面建立好;

3、然后需要在html中添加环绕代码:

<style>

   p {border:1px solid red}

   img {float:leftmargin:0 5px 5px 0}

</style>

4、代码添加完毕后,保存html文件,重新打开预览就可以看到文字环绕图片的格式了。

1、在div里面书写了一些文字,然后想要在放入一张图片。

2、首先,我们应该先给div设置宽度和高度,保证文字有一个范围。

3、然后通过background给div添加一张图片作为它的背景。

4、通过url()来连接图片,url里面放置的就是背景图片的路径。

5、放一张图片用作背景,注意,路径要写对。

6、保存之后文字就会覆盖在图片的上面了,而如果使用img标签,则没有这种效果。