发门网
为什么要让img浮动：
创始人
2024-04-16 13:25:06
0次

为什么要浮动： 

图片不浮动的话，图片和文字是像下面这样排版的：

代码：



红发歌姬

但是网站上的图片和文字是这样排的：

所以要让img浮动起来，，，浮动起来就能实现，原因看下面：

如何浮动及浮动的原理：

浮动代码：

float:left

浮动的原理：

代码演示：浮动

 结果：

结果显示，第一个盒子浮动起来了，第二个盒子上去了，但是第二个盒子身上的内容环绕第一个盒子显示。

让img浮动的详细原因：

所以我们就能解释为什么要给img图片加  float：left  的属性了：

看下面的代码，让img浮动起来，它下面的div盒子就上去了，文字也上去了，但是文字不会被img盒子给覆盖，而且能跟img排在一行上；

style{img{float:left}
}

红发歌姬

想了解 float:left属性 的看：css第十一课：浮动属性_陌一一的博客-CSDN博客 

想知道 float:left  和 position：absolute区别的看：css定位及定位和浮动的区别_陌一一的博客-CSDN博客_css浮动和定位有什么区别

词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：Linux 文件/目录管理

下一篇：Ubuntu 安装 Zotero, 并导入原有数据库，然后同步账户

相关内容

热门资讯

监控摄像头接入GB28181平... 流程简介将监控摄像头的视频在网站和APP中直播，要解决的几个问题是：1&...
Windows10添加群晖磁盘... 在使用群晖NAS时，我们需要通过本地映射的方式把NAS映射成本地的一块磁盘使用。 通过...
protocol buffer... 目录 目录 什么是protocol buffer 1.protobuf 1.1安装  1.2使用...
在Word、WPS中插入AxM... 引言 我最近需要写一些文章，在排版时发现AxMath插入的公式竟然会导致行间距异常&#...
【PdgCntEditor】解... 一、问题背景 大部分的图书对应的PDF，目录中的页码并非PDF中直接索引的页码...
Fluent中创建监测点 1 概述某些仿真问题，需要创建监测点，用于获取空间定点的数据࿰...
educoder数据结构与算法...                                                   ...
MySQL下载和安装（Wind... 前言：刚换了一台电脑，里面所有东西都需要重新配置，习惯了所...
MFC文件操作  MFC提供了一个文件操作的基类CFile，这个类提供了一个没有缓存的二进制格式的磁盘...
有效的括号 一、题目 给定一个只包括 '('，')'，'{'，'}'...