__x__(27)0907第四天__ float 浮动
float 浮动
块元素脱离文档流,水平排列。
浮动元素 会尽量往左上(left),或者右上(right)浮动,直到遇到 块元素 或者 其他浮动元素。
可选值:
none; 默认值,不脱离文档流,垂直排列,不浮动。
left; 脱离文档流,向文档 左上侧 浮动
right; 脱离文档流,向文档 右上侧 浮动
影响布局:
垂直上方的元素,如果是块元素,则浮动于块元素的下方。
垂直上方的元素,如果不是块元素,则浮动元素会覆盖住文档流的元素。
若位置宽度不够,则另起一行。
浮动的元素不会覆盖住 文字 。。。文字会自动环绕在浮动元素的周围
__x__(27)0907第四天__ float 浮动的更多相关文章
- __x__(28)0907第四天__固定布局
布局 固定布局,需要计算单位 自适应响应布局 固定布局 html代码 <!doctype html> <html> <head> <meta charset ...
- __x__(23)0907第四天__浏览器默认样式
浏览器默认样式: 为了美观,浏览器为了在页面没有样式时,也可以有一个较好的显示效果,默认设置若干 margin,padding. 作为开发人员,在CSS编写最初,一般都会清除默认样式, ...
- __x__(19)0907第四天__ HTML5 文本标签 及 样式
strong 表语义上的强调, em 表示语气上的强调: <strong>警告:离僵尸远点!</strong> 世界末日了,因为僵尸是<em>有毒的</em& ...
- __x__(20)0907第四天__列表ul,ol,dl
列表分为: 有序列表 ul: <ul type="disc"> <li>张三</li> <li>李四</li> < ...
- __x__(21)0907第四天__ css 盒模型 (框模型)
CSS 处理元素,把每个元素都包含在一个盒子里. 对网页的布局,其实就是对盒子的摆放及设置. 边框border,会使盒子变大: .box{ border: 10px 20px 30px 40px r ...
- __x__(22)0907第四天__ 垂直外边距重叠
外边距重叠, 也叫“外边距合并”,指的是,当两个外边距相遇时,它们将形成一个外边距. 合并后的外边距的高度,等于两个发生合并的外边距的高度中的较大者...在布局时,易造成混淆. 1. 上下元素 垂直外 ...
- __x__(25)0907第四天__ overflow 父元素对溢出内容的处理
overflow 父元素对于溢出内容的处理 visible; 默认值,对于溢出内容,在父元素之外显示. hidden; 对于溢出内容,进行隐藏,不显示. scroll; 对于溢 ...
- __x__(26)0907第四天__文档流_网页最底层
文档流 处在网页的最底层,表示的是一个页面中的位置. 创建的元素,默认都处于文档流中. 元素在文档流中的特点 块元素 在文档流中独占一行. 自上而下排列. 宽度默认占父元素的 100%,width=& ...
- __x__(24)0907第四天__ display 和 visibility
<a>百度</a> 也是内联元素,无法设置width和height <img>可以设置width和height,但是不会占用一行,所以是典型的行内块元素inl ...
随机推荐
- Beamer中左边画图, 右边文字解释
\begin{columns} \column{.4\textwidth} \begin{figure} \centering % Requires \usepackage{graphicx} \in ...
- 使用IntelliJ IDEA 配置Maven(转)
1. 下载Maven 官方地址:http://maven.apache.org/download.cgi 解压并新建一个本地仓库文件夹 2.配置本地仓库路径 3.配置maven环境变量 4.在Inte ...
- Python-爬虫-Beautifulsoup解析
简介 Beautiful Soup 是一个可以从HTML或XML文件中提取数据的Python库.它能够通过你喜欢的转换器实现惯用的文档导航,查找,修改文档的方式.Beautiful Soup会帮你节省 ...
- kafka_2.11-2.1.0测试
kafka测试启动创建topic ./kafka-topics.sh --create --zookeeper dip005:2181,dip006:2181,dip007 --replication ...
- Java实现大数加法运算的几种方法
大数加法 思路一:定义String变量str1和str2分别存储输入的两个大数,定义num1[]和num2[]两个int型数组,将两个字符串分别逐个字符逆序存入数组,定义sum[]数组存放求和结果,使 ...
- vmware ubuntu硬盘空间不够用,空间扩展
我从来没有想过我的虚拟机内存会不够用,毕竟已经20G了,可是最近学习python,装了些学习有关的软件, 期末做libvirt管理实验,存了两个镜像,就变成这样了,所以,我就像了要扩展硬盘空间,在网上 ...
- Android 10开发者预览版功能介绍
Android P的开发者预览版最亮眼的功能莫过于支持“刘海屏”等屏幕显示.同样在适配可折叠设备方面,Android Q的第一个开发者预览版也很“接地气”,谷歌早在去年11月就发布了对可折叠设备的支持 ...
- js判断是否在微信中打开
var ua = navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenger/i)=="micromessenger&quo ...
- 【BZOJ4589】Hard Nim(FWT)
题解: 由博弈论可以知道题目等价于求这$n$个数$\^$为0 快速幂$+fwt$ 这样是$nlog^2$的 并不能过 而且得注意$m$的数组$\^$一下会生成$2m$ #include <bit ...
- numpy array分割-【老鱼学numpy】
有合并,就有分割. 本节主要讲述如何通过numpy对数组进行横向/纵向分割. 横向/纵向分割数组 首先创建一个6行4列的数组,然后我们对此数组按照横向进行切割,分成3块,这样每块应该有2行,见例子: ...