float 浮动

块元素脱离文档流，水平排列。

浮动元素 会尽量往左上（left），或者右上（right）浮动，直到遇到 块元素 或者 其他浮动元素。

可选值：

none;   默认值，不脱离文档流，垂直排列，不浮动。

left;    脱离文档流，向文档 左上侧 浮动

right;    脱离文档流，向文档 右上侧 浮动

影响布局：

垂直上方的元素，如果是块元素，则浮动于块元素的下方。

垂直上方的元素，如果不是块元素，则浮动元素会覆盖住文档流的元素。

若位置宽度不够，则另起一行。

浮动的元素不会覆盖住 文字 。。。文字会自动环绕在浮动元素的周围

__x__(27)0907第四天__ float 浮动的更多相关文章

  1. __x__(28)0907第四天__固定布局

    布局 固定布局,需要计算单位 自适应响应布局  固定布局 html代码 <!doctype html> <html> <head> <meta charset ...

  2. __x__(23)0907第四天__浏览器默认样式

    浏览器默认样式:         为了美观,浏览器为了在页面没有样式时,也可以有一个较好的显示效果,默认设置若干 margin,padding. 作为开发人员,在CSS编写最初,一般都会清除默认样式, ...

  3. __x__(19)0907第四天__ HTML5 文本标签 及 样式

    strong 表语义上的强调, em 表示语气上的强调: <strong>警告:离僵尸远点!</strong> 世界末日了,因为僵尸是<em>有毒的</em& ...

  4. __x__(20)0907第四天__列表ul，ol，dl

    列表分为: 有序列表 ul: <ul type="disc"> <li>张三</li> <li>李四</li> < ...

  5. __x__(21)0907第四天__ css 盒模型 (框模型)

    CSS 处理元素,把每个元素都包含在一个盒子里. 对网页的布局,其实就是对盒子的摆放及设置.  边框border,会使盒子变大: .box{ border: 10px 20px 30px 40px r ...

  6. __x__(22)0907第四天__ 垂直外边距重叠

    外边距重叠, 也叫“外边距合并”,指的是,当两个外边距相遇时,它们将形成一个外边距. 合并后的外边距的高度,等于两个发生合并的外边距的高度中的较大者...在布局时,易造成混淆. 1. 上下元素 垂直外 ...

  7. __x__(25)0907第四天__ overflow 父元素对溢出内容的处理

    overflow    父元素对于溢出内容的处理 visible;    默认值,对于溢出内容,在父元素之外显示. hidden;    对于溢出内容,进行隐藏,不显示. scroll;    对于溢 ...

  8. __x__(26)0907第四天__文档流_网页最底层

    文档流 处在网页的最底层,表示的是一个页面中的位置. 创建的元素,默认都处于文档流中. 元素在文档流中的特点 块元素 在文档流中独占一行. 自上而下排列. 宽度默认占父元素的 100%,width=& ...

  9. __x__(24)0907第四天__ display 和 visibility

    <a>百度</a>    也是内联元素,无法设置width和height <img>可以设置width和height,但是不会占用一行,所以是典型的行内块元素inl ...

随机推荐

  1. Docker：手动制作镜像 [五]

    一.制作docker镜像的步骤 1.启动容器安装软件服务 2.将安装好服务的容器commit提交为镜像 3:.启动新容器来测试新提交的镜像 二.制作支持ssh远程登录的docker镜像 1.启动容器安 ...

  2. 《JavaScript.DOM》读书笔记

  3. 清除系统默认样式，文本样式,高级选择器(权重),边界圆角，a标签的四大伪类，背景图片

    清除系统默认样式 大多系统预定义标签,有默认样式,不满足实际开发需求,反倒影响布局通常清除系统样式,利于开发 body,h1-h6,p,table { margin:; } ul { margin:; ...

  4. 第三节: Quartz.Net五大构件之Scheduler(创建、封装、基本方法等)和Job(创建、关联等)

    一. 五大构件 引言: Quartz.Net的五大构件 1.  调度器:Scheduler 2.  作业任务:Job 3.  触发器: Trigger 4.  线程池: SimpleThreadPoo ...

  5. react中键盘enter事件处理

    对于常见的搜索需求业务场景,用户输入完成后,点击enter事件请求数据,要求不提交页面,实现数据局部更新,这需要用到react中的表单Forms. 处理方法: (1)html书写 form标签中去掉a ...

  6. 401AM 随笔~ 322~330 的总结

    web简介:html:超文本标记语言css:层叠样式表 或者css样式JavaScript:一门脚本语言前端:html css javascript<!---->:注释段落与文字p.b加粗 ...

  7. C“控制”Lua

    [前言] 写过Windows程序的人都知道,对于应用程序,如果需要在本地保存一些配置信息,我们经常将这些配置信息写在注册表或者本地的配置文件中,很多应用都是将一些配置信息写在配置文件中,比如以ini结 ...

  8. 【原创】大叔问题定位分享（10）提交spark任务偶尔报错 org.apache.spark.SparkException: A master URL must be set in your configuration

    spark 2.1.1 一 问题重现 问题代码示例 object MethodPositionTest { val sparkConf = new SparkConf().setAppName(&qu ...

  9. vue.js过滤器

    import Vue from 'vue' import { ENV } from '@/config/conf' const dateFormat = (str) => { var date ...

  10. 初识C语言（一）

    C语言的结构体 一个C程序就是由多个头文件和函数组成 #include<stdio.h> /* 包含头文件*/ int main() { printf('"hello world ...