1.html5的新特性？ 添加了video，radio标签 添加了canvas画布和svg,渲染矢量图片 添加了一些列语义化标签header,footer,main,section,aside,nav等 input的type值新添加了很多属性（email，url，number，range，Date pickers (date, month, week, time, datetime, datetime-local)，search，color）
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .box1{ border: 10px solid red;
1. 横向布局 (1) 转化为inline-block - 注：元素换行会产生空格，给父级加font-size:0;进行处理 - 注：转化为inline-block之后记得给元素加上vertical-align:top;（默认基线对齐 方式改为顶部对齐，处理底部出现空隙的问题） (2) 浮动 - 注：记得
说到position，稍微对css了解的能马上说出四个属性值：static 、relative、absolute、fixed。 更深一步去讨论，牵扯出诸如上文提到的normal flow、containing block、bfc、margin collapse，base line，有多少人能很好的回答完整呢，所以在此做一个自己的总结归纳。 1.normal flow norma
何为BFC BFC（Block Formatting Context）格式化上下文，是Web页面中盒模型布局的CSS渲染模式，指一个独立的渲染区域或者说是一个隔离的独立容器。 形成BFC的条件 浮动元素，float 除 none 以外的值； 定位元素，position（absolute，fixed）； display 为以下其中之一的值 inline-block，table-cell，tabl
BFC叫做块级格式化上下文，本质是在一个独立的渲染区域，单独规定区域内部的渲染规则。 BFC的布局规则 1.BFC区域不会与外部区域发生相互影响。 2..BFC内部的盒子，会在垂直方向依次排列。垂直方向上也会发生边距重叠。 3.BFC的区域不会与外部float重叠。 4.计算BFC的高度时，内部浮
什么是BFC？ BFC 全称为 块级格式化上下文（Block Fromatting Context），是Web页面的可视化CSS渲染出的一部分。它是块级盒布局出现的区域，也是浮动层元素进行交互的区域。简单的来说，它就是一种会影响元素与元素之间的位置、间距的属性。 BFC 的特性 1.内部的box会在垂直方向，从顶部一个
前言 本文主要是javascript和css方面的基础面试题，适合面试前以及平时复习食用。 基础知识是前端一面必问的，如果你在基础知识这一块翻车了，就算你框架玩的再6，webpack、git、node学习的再好也无济于事，因为对方就不会再给你展示的机会，千万不要因为基础错过了自己心怡的公司。前端
BFC (Block Fromatting Context)块级格式化上下文，是一个独立的渲染区域，内部元素的渲染不会影响外边的元素。 形成BFC的条件 float属性不是none；position是absolute或fixed；display是inline-block, table-cell, table-caption, flex, inline-flex；overflow不是visible； BFC的应用
前端的兴起 前端真正兴起和开始频繁出现在大家的视线里，大概是在十年前。彼时的 Web 开发基本是由后端主导，前端能做的只是校验一下数据、操作一下 DOM。（其中数据检验是 JS 产生的根本原因：当时网络太慢，在服务端检验数据并反馈给用户，让用户知晓输入错误，这个流程太长、反应太慢，因
标签语义化： 语义和默认样式的区别： 默认样式是浏览器设定的一些常用tag的表现形式；语义化的主要目的就是让大家直观的认识标签和属性的用途和作用； 标签语义化作用： 当只有HTML页面时，没有CSS，我们仍然可以很清晰的看懂页面的DOM结构团队维护，当团队来review代码或者重构时，增强代码
都知道解决 外边距塌陷 有多种方法 其中一种 是给父盒子加个overflow:hiden;例如 <style> p { color: #f55; background: #fcc; width: 200px; line-height: 100px; text-align:center; margin: 100px; } .a { /* over
什么是BFC BFC - Block Formatting Context 是块级格式化上下文，它规定了每一个BFC区域只包括其子元素，不包括其子元素的子元素，每一个BFC区域都是独立隔绝的,互不影响! 实现 触发BFC的条件 ·body根元素 ·设置浮动，不包括none ·设置定位，absoulte或者fixed ·行内块显示模式，inline-b
BFC 定义 BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域， 只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。 在解释什么是BFC之前，我们需要先知道Box、Formatting Context的概念。 Box：css布局的基
Formatting context 我们把网页看作是由很多个盒子组成的，而这些盒子的展示方式，就是由display这个属性来决定的。 这里出现了一个概念，叫做Formatting context（格式上下文）： Formatting context 是 W3C CSS2.1 规范中的一个概念。它是页面中的一块渲染区域，有一套渲染规则决定了其子
原型链 function Person() { } var person = new Person(); person.name = 'Kevin'; console.log(person.name) // Kevin Person为构造函数 person为实例对象 构造函数指向原型 Person.prototype person和Person都是通过Person的原型 prototype构造出来的 所以person.proto
标准文档流： 标准文档流指元素排版布局过程中，元素默认从左到右，从上到下的布局方式，自动换行。 块级元素 和 行内元素 在标准文档流中的表现： 块级元素： 1.块级元素是独占一行的，不与其他元素并列 2.可设置宽高，若不设置宽高则宽度与父元素相同 行内元素： 1.与其他元素并排 2.设置宽高无效
问题概述： 父元素在文档流中高度默认是被子元素撑开的，当子元素脱离文档流以后，将无法撑起父元素的高度，也就会导致父元素的高度塌陷 父元素的高度一旦塌陷所有元素的位置将会上移，导致整个页面的布局混乱 方法1 开启父元素的BFC或hasLayout 1.1 BFC 1.1.1 Block Formatting Context-块
前端学习笔记47-高度塌陷和BFC 高度塌陷BFC 浮动本来是用来设置文字环绕的，但是从前面学的可以看到，我们拿浮动来设置布局。这看着很爽，但是也是有一些问题的。 高度塌陷 拿上一个举例，我们把中间的main的高度写死了，还把它的三个子元素的高度写死。但是实际中很多都是没写死
脑图在线链接 本文内容依据【js每日一题】公众号精彩文章总结而来
一、常见定位方案在讲 BFC 之前，我们先来了解一下常见的定位方案，定位方案是控制元素的布局，有三种常见方案:普通流 (normal flow)在普通流中，元素按照其在 HTML 中的先后位置至上而下布局，在这个过程中，行内元素水平排列，直到当行被占满然后换行，块级元素则会被渲染为完整的一个新行，除非另
小萌新刚刚入坑博客园，笔记可能并不是很完美，如有不足之处，还望各位指出，小弟必定铭记 下面是因为浮动而造成的高度坍塌 1.高度坍塌 高度坍塌的问题： 在浮动布局中，父元素的高度默认是被子元素撑开的，
1.CSS布局奇淫巧计之-强大的负边距 2.负margin的原理及应用 3.10 分钟理解 BFC 原理 4.CSS学习笔记——深入理解BFC 这个挺好的，就是看到最后一点点有点懵
BFC：Block format context 块级格式化上下文 一块独立的渲染区域，内部元素的渲染不会影响边界以外的元素。 它属于普通流，即：元素按照其在 HTML 中的先后位置至上而下布局，在这个过程中，行内元素水平排列，直到当行被占满然后换行，块级元素则会被渲染为完整的一个新行，除非另外指定，否则所有
BFC定义 BFC(Block formatting context)直译为"块级格式化上下文"。 它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。 block-level box:display 属性为 block, list-item, table 的元素， 会生成 block-l
