1.BFC和Layout区别: BFC和Layout的作用是一样的,只是对浏览器的支持不同而已. BFC- -标准浏览器所具有的 Layout- -IE浏览器所具有的 BFC详解地址:http://blog.csdn.net/baidu_37107022/article/details/71634396 2.Layout布局定义 它决定了块级元素如何对它的内容进行布局,以及与其它元素的关系和相互作用 该布局有hasLayout属性控制: 取值:true,false 3.触发Layout的方式…
Sass学习笔记持续整理中,开篇不讲怎么安装,sass是什么,这些搜索引擎会告诉你,我们从sass的作用开始讲起,知道sass用来干什么,有什么作用,我们才能相信用sass的好处,并且时时刻刻想着sass的设计思维--Don't Repeat Yourself.这一篇将阐述Sass如何利用变量.选择器嵌套.混合器和选择器继承来帮我们又快又好地搞定CSS. 零. Sass的作用是什么? Sass的作用是,帮助我们更快地(又快)写出具有高可维护性(又好)的CSS代码. 直白点说就是,用了sass,写…
BFC:Block Formatting Contexts–块级元素格式化上下文 1.BFC定义 它决定了块级元素如何对它的内容进行布局,以及与其它元素的关系和相互作用 关键词解释: 块级元素:父级(是一个块元素) 内容:子元素(是一个块元素) 其它元素:与内容同级别的兄弟元素 相互作用:BFC里的元素与外面的元素不会发生影响 2.BFC触发方式 2.BFC的布局规则 3.普通文档流布局规则 4.代码演示 <!DOCTYPE html> <html> <head> &l…
在最近的web开发中是不是就会用到一些选择器,发现很多尤其是CSS3新增的不太熟悉,在此总结一下. 优先级 不同级别 1. 在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式. 2.作为style属性写在元素内的样式 3.id选择器 4.类选择器 5.标签选择器 6.通配符选择器 7.浏览器自定义 同一级别 同一级别中后写的会覆盖先写的样式 基础选择器 选择器 含义 * 通用元素选择器,匹配页面任何元素(这也就决定了我们很少使用) #id id选择器,匹配特定id的元素 .…
原文地址:http://www.cnblogs.com/dolphinX/p/3347713.html 在最近的web开发中是不是就会用到一些选择器,发现很多尤其是CSS3新增的不太熟悉,在此总结一下. 优先级 不同级别 1. 在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式. 2.作为style属性写在元素内的样式 3.id选择器 4.类选择器 5.标签选择器 6.通配符选择器 7.浏览器自定义 同一级别 同一级别中后写的会覆盖先写的样式 基础选择器 选择器 含义 *…
做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道一名好的前端,要尽可能不使用hack的情况下实现需求,做到较好的用户体验.可是啊,现实太残酷,浏览器厂商之间历史遗留的问题让我们在目标需求下不得不向hack妥协,虽然这只是个别情况.今天,结合自己的经验和理解,做了几个demo把IE6~IE10和其他标准浏览器的CSS hack做一个总结,也许本文应…
1)CSS:层叠样式表(英文全称:Cascading Style Sheets) 是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言. CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化. CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力. 2)层叠样式表类型 分为:行间样式.内部样式.外部样式 代码演示: <!DOCTYPE html>…
1.定位取值概览 2.相对定位relative <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> div{ width: 200px; height: 200px; color: #fff; } .div1{ background: red; } .div2{ background: green; /…
浮动(float),一个我们即爱又恨的属性.爱,因为通过浮动,我们能很方便地布局: 恨,浮动之后遗留下来太多的问题需要解决,特别是IE6-7(以下无特殊说明均指 windows 平台的 IE浏览器). 下面我们就来详细说明浮动!!!!!!!! 1.文档流 在浮动中有一个文档流的概念,所以在这里不得不介绍一下文档流了. 代码演示 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <…
样式初始化:是指对HTML中某些标签的默认样式进行清除 样式初始化目的: 不同浏览器的默认样式不一样,若不清理,会导致相同的代码在浏览器中解析结果不一样,为了避免这种情况,所以需要进行样式初始化. 代码演示 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> /*一.不适用通配符初始化*/ body,h…