文档流

处在网页的最底层,表示的是一个页面中的位置。

创建的元素,默认都处于文档流中。

元素在文档流中的特点

  • 块元素

    • 在文档流中独占一行。
    • 自上而下排列。
    • 宽度默认占父元素的 100%,width="auto"。。。当元素的 width 和 height 设置为默认auto,此时指定内边距不会影响可见框大小,而是会修改 width 来自适应内边距。
    • 高度将被内容撑开。
  • 内联元素
    • 不会独占一行,只占自身大小。
    • 默认从左往右排列,满了就另起一行。
    • 会出现一个元素,上一行一部分,下一行一部分。

元素脱离文档流以后:

  • 块元素

width 和 height 会被内容撑开。

  • 内联元素

会变成块元素,可以设置 width 和 height。

width 和 height会被内容撑开。

__x__(26)0907第四天__文档流_网页最底层的更多相关文章

  1. __x__(27)0907第四天__ float 浮动

     float 浮动 块元素脱离文档流,水平排列. 浮动元素 会尽量往左上(left),或者右上(right)浮动,直到遇到 块元素 或者 其他浮动元素. 可选值: none;   默认值,不脱离文档流 ...

  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__(28)0907第四天__固定布局

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

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

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

随机推荐

  1. CSS margin负值学习及实际应用

    前言 margin属性在实际中非常常用,也是平时踩坑较多的地方.margin折叠部分相信不少人都因为这样那样的原因中过招.margin负值也是很常用的功能,很多特殊的布局方法都依赖于它. 表现 虽然m ...

  2. Linux动态库生成与使用指南

    相关阅读: Linux静态库生成指南 Linux下动态库文件的文件名形如 libxxx.so,其中so是 Shared Object 的缩写,即可以共享的目标文件. 在链接动态库生成可执行文件时,并不 ...

  3. 玩转ubuntu之初体验

    安装的是ubuntu16.04.1,分区和具体细节就不多说了,非常简单 安装完之后要做的几件事: 1.设置root密码 #设置root密码 sudo passwd root 2.检查并更新系统 #ub ...

  4. 计算机视觉学习记录 - Implementing a Neural Network from Scratch - An Introduction

    0 - 学习目标 我们将实现一个简单的3层神经网络,我们不会仔细推到所需要的数学公式,但我们会给出我们这样做的直观解释.注意,此次代码并不能达到非常好的效果,可以自己进一步调整或者完成课后练习来进行改 ...

  5. Linux设置SSH登录(SecureCrt)

    背景 每次登录需要输入复杂的密码,而且不停的有人在尝试登录root账户.感觉心慌慌,所以不得不设置更加安全的登录方式. 配置SSH无密码登录需要4步 准备工作 生成公钥和私钥 导入公钥到认证文件,更改 ...

  6. ES--07

    61.索引管理_快速上机动手实战创建.修改以及删除索引 课程大纲 1.为什么我们要手动创建索引? 2.创建索引 创建索引的语法 PUT /my_index{ "settings": ...

  7. Solidity构造函数和析构函数

    构造函数:当方法名字和合约名字相同的时候,这个就是构造函数,构造函数在合约对象创建之后执行的 contract Person{ function Peron(){//构造函数Person ... } ...

  8. unity读取txt,并且生成vector3的数组

    读取txt的脚本: public void ReadFileTX(){ var str = File.ReadAllText(Application.streamingAssetsPath + &qu ...

  9. sqlserver(查看被锁进程)

    -- ###### 查看被锁进程 ###### select 标志, 进程ID=spid,线程ID=kpid,块进程ID=blocked,数据库ID=dbid, 数据库名=db_name(dbid), ...

  10. python 列表 元组 字符串

    列表添加: list.append() list.extend() list.insert() 列表删除: list.remove()   #删除某一个元素 list.pop()  #删除某一个返回删 ...