改变元素性质的三种方式： position display float 行级元素，行级元素的margin上下不起作用了，左右还行 占位： 针对标准流来说， 元素添加float，position元素，不会占位（脱离标准文档流） 浏览器默认的天生inline-block元素（有内在尺寸，设宽高，不自动换 ...
分类：
其他好文 时间：
2018-10-15 18:23:11
阅读次数：
141
## CSS和模型 ##CSS盒模型本质上是一个盒子，封装周围的 HTML 元素，包括 外边距（marign），边框（border），填充（padding），内容物（content） 盒子模型的类型：W3C 标准和模型和 IE 盒模型（怪异盒模型） 盒模型 -- 基本框 盒模型 -- 包含块 盒模型 ...
分类：
Web程序 时间：
2018-09-29 20:32:52
阅读次数：
191
CSS Box Model（盒子模型） 一、简介 所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。 CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。 盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。 ...
分类：
Web程序 时间：
2018-07-22 12:00:28
阅读次数：
156
一、基本概念 盒子模型是css中一个重要的概念，理解了盒子模型才能更好的排版，盒模型的组成：content padding border margin 二、盒模型的分类 盒子模型有两种，分别是 ie 盒子模型和标准 w3c 盒子模型 标准和模型中计算高度和宽度时只计算content的宽度和高度；而I ...
分类：
Web程序 时间：
2018-07-01 14:56:43
阅读次数：
201
今天是一个跨天的任务，学习目标是：掌握CSS盒模型及Float； 盒模型要点： 如果盒子的高度被设置为百分比长度，那么盒子高度不会遵循这个设置了的百分比长度，而是总会采用盒子内容的高度，除非给它设置了一个绝对高度（例如，像素或者 em）。这比把页面上每个盒子的高度默认设置为视口高度的 100% 更方 ...
分类：
其他好文 时间：
2018-06-19 18:29:51
阅读次数：
140
1、CSS盒子模型 HTML文档中的每个元素都被描绘成矩形盒子，这些矩形盒子通过一个模型来描述其占用空间，这个模型称为盒子模型。 盒子模型通过四个边界来描述：margin（外边距），border（边框），padding（内填充），content（内容区域），如图所示： 2、border 3.padd ...
分类：
Web程序 时间：
2018-06-02 16:33:20
阅读次数：
258
一个web页面由许多html元素组成，而每一个html元素都可以表示为一个矩形的盒子，CSS盒模型正是描述这些矩形盒子的存在。 MDN的描述： When laying out a document, the browser's rendering engine represents each ele ...
分类：
Web程序 时间：
2018-05-25 15:32:03
阅读次数：
197
CSS 盒子模型(Box Model) 所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。 CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。 盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。 下面的图 ...
分类：
Web程序 时间：
2018-05-17 13:31:41
阅读次数：
190
BFC:块级格式化上下文 IFC:行内格式化上下文 实例如下： <div class="out" style="background: red;"> <div class="in" style="height: 100px; margin-top: 10px; background: green;" ...
分类：
Web程序 时间：
2018-05-11 00:51:47
阅读次数：
400
一、CSS层叠 在前端程序员对CSS编写的过程中，CSS选择器的作用是用来选中某个元素，并对当前的元素进行样式上的渲染，那么每一个选择器都有属于自己的一些解析规则。那我们今天所探讨的CSS层叠就是浏览器对多个样式的来源进行叠加，并最终解析成渲染效果，那这个过程我们就称为CSS层叠。 1）CSS样式的 ...
分类：
Web程序 时间：
2018-05-07 19:52:28
阅读次数：
211
