css
cynwang
这个作者很懒,什么都没留下…
展开
-
css position相关问题延伸
一、'display'、'position' 和 'float' 的相互关系首先我们先来看下这3个属性。display 属性:规定元素应该生成的框的类型。 block 象块类型元素一样显示;none 缺省值;inline 象行内元素类型一样显示; inline-block 象行内元素一样显示,但其内容象块类型元素一样显示;list-item 象块类型元素一样显示,并添加原创 2016-08-16 14:39:58 · 438 阅读 · 0 评论 -
BFC介绍
BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等)。虽然我知道如何利用 BFC 解决这些问题,但当别人问我 BFC 是什么,我还是不能很有底气地解释清楚。于是这两天仔细阅读了CSS2.1 spec 和许多文章来全面地理解BFC。一、BFC是什么? 在解释 BFC 是什么之前,需要先介转载 2016-08-16 11:00:14 · 447 阅读 · 0 评论 -
CSS包含块(Containing Block)
包含块(Containing Block)是视觉格式化模型的一个重要概念,它与框模型类似,也可以理解为一个矩形,而这个矩形的作用是为它里面包含的元素提供一个参考,元素的尺寸和位置的计算往往是由该元素所在的包含块决定的。包含块简单说就是定位参考框,或者定位坐标参考系,元素一旦定义了定位显示(相对、绝对、固定)都具有包含块性质,它所包含的定位元素都将以该包含块为坐标系进行定位和调整。原创 2016-08-15 19:24:25 · 668 阅读 · 0 评论 -
CSS的选择器,优先级
1.基础的选择器选择器含义示例*通用元素选择器,匹配任何元素* { margin:0; padding:0; }E标签选择器,匹配所有使用E标签的元素p { font-size:2em; }.info和E.infoclass选择器,匹配原创 2016-08-07 15:49:17 · 486 阅读 · 0 评论 -
[HTML/CSS]盒子模型,块级元素和行内元素
目录概述 盒子模型 块级元素 行内元素 可变元素 总结 概述在div+css中,了解块级元素和行内元素还是非常有必要的,比如:对行内元素使用width属性就会失效。虽然自己不是做前端的,但是,在项目中,曾经也弄过从前端布局,也吃过这方面的亏。今天,群里有朋友问起这个,就趁着学习一下,也算是查漏补缺吧,虽然,谈不上精通,但是了解,还是很有必要的。盒子模型css原创 2016-08-07 11:17:47 · 471 阅读 · 0 评论 -
Normalize vs Reset
综述Normalize.css是一种CSS reset的替代方案。经过@necolas和@jon_neal花了几百个小时来努力研究不同浏览器的默认样式的差异,这个项目终于变成了现在这样。我们创造normalize.css有下面这几个目的:保护有用的浏览器默认样式而不是完全去掉它们一般化的样式:为大部分HTML元素提供修复浏览器自身的bug并保证各浏览器的一致性优化CSS可用性:用一原创 2016-09-08 20:33:24 · 219 阅读 · 0 评论 -
CSS 中类 (classes) 和 ID 的区别
1.CSS 中类 (classes) 和 ID 的区别。在样式表定义一个样式的时候,可以定义id也可以定义class。在CSS文件里书写时,ID加前缀“#”;CLASS用“.”id一个页面只可以使用一次;class可以多次引用。ID是一个标签,用于区分不同的结构和内容,就象名字,如果一个屋子有2个人同名,就会出现混淆;class是一个样式,可以套在任何结构和内容上,就象一件衣服;原创 2016-09-08 20:46:29 · 2252 阅读 · 0 评论 -
两列布局中单列定宽单列自适应布局的5种思路
前面的话 说起自适应布局方式,单列定宽单列自适应布局是最基本的布局形式。本文将从float、inline-block、table、absolute和flex这五种思路来详细说明如何巧妙地实现布局 思路一: float 说起两列布局,最常见的就是使用float来实现。float浮动布局的缺点是浮动后会造成文本环绕等效果,以及需要及时清除浮动。如果各浮动元素的高原创 2016-09-26 10:35:41 · 334 阅读 · 0 评论 -
两列自适应布局的3种思路
两列自适应布局的3种思路前面的话 前面已经介绍过单列定宽单列自适应的两列布局,而两列自适应布局是指一列由内容撑开,另一列撑满剩余宽度的布局方式。本文将从float、table和flex来介绍两列自适应布局的3种思路。 思路一: float 在单列定宽单列自适应的两列布局中,经常用float和负margin配合实现布局效果。但由于m原创 2016-09-26 10:41:26 · 867 阅读 · 0 评论