1.流

流:html元素在网页中显示的顺序

标准流:在html文件中,写在前面的元素在前面显示,写在后面的html元素在后面显示。

非标准流:在html之中,当某个元素脱离了标准流,那么它处于非标准流

2.盒子概念

要弄清盒子模型这个概念,就必须先明白下面这个几个概念:

在网页设计中常听的属性名:内容(content)、填充(padding)、边框(border)、边界(margin),CSS盒子模式都具备这些属性:

理解图示:

css笔记15:盒子模型的更多相关文章

  1. HTML&CSS精选笔记_盒子模型

    盒子模型 认识盒子模型 所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器.每个矩形都由元素的内容.内边距(padding).边框(border)和外边距(margi ...

  2. 【CSS学习】--- 盒子模型

    一.前言:这篇只作为本人的笔记,以后慢慢再补充. 页面中的所有元素都可以被看作一个一个的“盒子”.这些盒子都包含了:内容(content).内边距(padding).边框(border)以及外边距(m ...

  3. css中的盒子模型

    css中的盒子模型 css中的盒子模型,有两种,一种是“标准 W3C 盒子模型”,另外一种是IE盒子模型.   1.w3c盒子模型 从图中可以看出:w3c盒子模型的范围包括了:margin,borde ...

  4. CSS学习之盒子模型

    1. 前言 盒子模型,英文即box model.无论是div.span.还是a都是盒子. 但是,图片.表单元素一律看作是文本,它们并不是盒子.这个很好理解,比如说,一张图片里并不能放东西,它自己就是自 ...

  5. CSS学习系列1 - CSS中的盒子模型 box model

    css中有一个盒子模型的概念. 主要是用来告诉浏览器如何来计算页面元素的宽度和高度, 比如该元素的宽度/高度 是否包括内边距,边框,外边距.  盒子模型有一个属性box-sizing属性来说明是否包括 ...

  6. CSS Flexbox 弹性盒子模型

    CSS Flexbox 弹性盒子模型 设置元素样式为 display: flex 或 display: inline-flex, 让元素变成flex容器, 从而可以通过flex模式布局它的子元素. f ...

  7. CSS学习笔记07 盒子模型

    1.盒子模型 所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器.每个矩形都由元素的内容.内边距(padding).边框(border)和外边距(margin)组成. ...

  8. CSS学习笔记:盒子模型

    盒子模型(CSS basic box model):When laying out a document, the browser's rendering engine represents each ...

  9. CSS 小结笔记之盒子模型

    网页标签可以看成是一个个盒子,页面设计就像垒积木一样,在网页中将盒子摆好显示出来.在浏览器中可以很清楚的去看到一个标签的盒子,具体方法如下: 打开浏览器的开发人员工具,在Elements中选中一个标签 ...

随机推荐

  1. 微软Azure已开始支持hadoop--大数据云计算

    微软Azure已开始支持hadoop,对于有需要弹性大数据运算的公司可能是个好消息.据悉,近期微软已提供一个预览版的Azure HDInsight(Hadoop on Azure)服务,运行在Linu ...

  2. 解决A program file was not specified in the launch configuration.问题

        问题描述: 在eclipse 中开发c++或c是比较麻烦的事情,刚刚配置好mingw32和cdt和环境变量后,新建一个hello world的c++项目还是会出现问题.主要是在编译的时候会提示 ...

  3. linux网络编程笔记——TCP

    1.TCP和UDP TCP是长连接像持续的打电话,UDP是短消息更像是发短信.TCP需要消耗相对较多的资源,但是传输质量有保障,UDP本身是不会考虑传输质量的问题. 2.网络传输内容 我习惯的做法是直 ...

  4. TypeScript学习笔记(三):类

    类 在TypeScript中,类似于C#的结构,即一个文件中可以存在多个类,且文件名可以任意取,我们先看一个简单的类的示例. class Person { private name: string; ...

  5. 8天玩转并行开发——第一天 Parallel的使用

    转自:http://www.cnblogs.com/huangxincheng/archive/2012/04/02/2429543.html 随着多核时代的到来,并行开发越来越展示出它的强大威力,像 ...

  6. OpenNebula 创建虚拟机失败(未解决)

    Tue Jul :: [ReM][D]: Req: UID: AclInfo invoked Tue Jul :: [ReM][D]: Req: UID: AclInfo result SUCCESS ...

  7. Cloud Computing Deployment Models

    Cloud computing can broadly be broken down into three main categories based on the deployment model. ...

  8. OpenStack API 与 CloudStack API 模块比较

    OpenStack API Block Storage Service API Compute API Compute API extensions Identity Service API and ...

  9. 让div变得大方美观 bootstrap

    <div class="panel panel-default "> <div class="panel-heading"> <h ...

  10. SSL握手过程

    原文地址: http://my.oschina.net/u/1188877/blog/164982 一.SSL握手有三个目的:1. 客户端与服务器需要就一组用于保护数据的算法达成一致:2. 它们需要确 ...