BFC是什么? BFC(Block Formatting Context)中文直译就是‘块级格式上下文’,它是 W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用. 通俗点说,BFC是一个独立的布局环境,我们可以理解为一个箱子(实际上是看不见摸不着的),箱子内部的元素无论如何翻江倒海,都不会影响到外部.转换为BFC的理解则是:BFC中的元素的布局是不受外界的影响(我们往往利用这个特性来消除浮动元素对其非浮动的兄弟元素和其子元素带来的影响.)…

这篇文章发布于 2015年02月12日,星期四,23:36,归类于 css相关. 阅读 30873 次, 今日 63 次 by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=4588 一.开篇之言 要说web上实现两栏自适应布局的方法,一双手都数不过来.不知大家有没有细想过,为什么这些方法可以实现自适应布局呢? 本文就将深入探讨下流体特性和BFC特性下的两栏自适应布局,还是…

一.块状元素的流体特性与自适应布局 块状元素像放在容器中的水流一样,内容区域会随着margin, padding, border的出现自动填满剩余空间,这就是块状元素的流体特性. 来一个小实验: div { margin-left:100px: width:100%: } 此时发现,左侧永远100px留白,而div随着容器宽度变化而自适应变化了 我们需要好好利用左侧100px的留白间距,岂不是就可以实现两栏自适应效果? 为了不影响原本的流体特性,我们可以使用破坏性属性,如浮动(float:lef…

一.BFC元素简介与基本表现. BFC全程"Block Formatting Context",中文为"块级格式化上下文".记住一句话:BFC元素特性表现原则就是,内部子元素再怎么翻江倒海,翻雨覆雨都不会影响外部的元素.所以,避免margin穿透.清楚浮动什么的也就好理解了. 什么时候出发BFC呢? 常见的情况如下: -> float 的值不为none ; -> overflow 的值为auto,scroll或hidden; -> display的…

ES6 的新增特性以及简单语法  let 和 const 模板字符串 箭头函数 对象单体模式 es6面向对象 模块化  let 和 const 之前一直用 var 来声明变量,ES6 新增 let 和 const script type="text/javascript"> // let声明变量块级作用域,不能重复声明 // let声明的变量 是块级作用域,不能重复声明 // { // // let a = 12; // let a = 12; // let a = 13; //…

块级元素会有bfc条件------可以触发bfc--------利用bfc的特性来解决一些问题 1.什么是BFC? 就是一个封闭独立的渲染的区域 2.什么元素会有BFC的条件? ---块级元素会有,行内元素没有 3.什么情况下块级元素可以产生bfc?(触发bfc) 四种中有一种就行,可以触发bfc BFC特性 4.BFC主要用途(块级元素会有bfc条件------可以触发bfc--------利用bfc的特性来解决一些问题) 1.清除浮动 2.解决外边距合并的问题 3.做右侧自适应…

1.一些常用的ES6的特性: let, const, class, extends, super, arrow functions, template string, destructuring, default, rest arguments,这些都是ES6常用的语法. let, const 这两个的用途与var类似,都是用来声明变量的,但在实际运用中他俩都有各自的特殊用途. Dome1: var name = '张三' while (true) { var name = '李四' conso…

lambda表达式 简介 lambda 表达式的语法 变量作用域 函数式接口 内置函数式接口 默认方法 Stream(流) 创建 stream Filter(过滤) Sorted(排序) Map(映射) Match(匹配) Count(计数) Parallel Stream(并行流) Collector 和 Collectors Map 新方法 新的日期与时间 API lambda 表达式 简介 在我看来 lambda 表达式就是简化了以前的一大堆繁琐的操作,让我们代码看起来更加简洁,让以前五六…

附上源代码: using System; using System.Collections.Generic; using System.Data; using System.Linq; using System.Text; using System.Threading.Tasks; namespace 反射_特性 { [AttributeUsage(AttributeTargets.Property, AllowMultiple = false, Inherited = false)] publ…

下面我们来看一下自动生成的代码中的MVVM架构的关系.Main是一个可视的控件,MainController是这个控件的控制类,MainModel是这个控件的模型类. 在上面的图片中,左边是Main.js中的代码,右边是MainController.js 和 MainModel.js中的代码,可以看到MVVM中的事件绑定和属性值绑定都用到了.上图中红色的部分标注了一个按钮“Button”的handler(即click)事件绑定到MainController.js中的函数“OnClickButto…