CSS inline-block布局详解

CSS inline-block布局详解

因为进了新公司之后工作太忙,也可能因为自己还是职场小菜鸟,过了两个月了才算真正适应新公司的工作了。

哈哈,就像上次公司签下艾佛森当形象代言人时,台下的记着问艾佛森:有无打算来CBA打篮球,能不能适应CBA的节奏?然后艾佛森说:自己是一名职业运动员,而且是打了10多年的篮球的职业运动员了,不管什么样的比赛形式都能适应,唯一要关心的适不适应当地的风俗和文化。

当然艾佛森说回答记者这个问题是用英语的,

阅读更多»

IE css bug的罪恶根源——hasLayout(布局)

IE css bug的罪恶根源——hasLayout(布局)

由于各个浏览器的渲染CSS引擎不同,从而导致工程师们要写很多代码来解决很多兼容性的问题,在 css 不兼容上lE的 bug 比太多数浏览器都多。IE的与其他浏览器不同的原因之一是,IE的CSS渲染引擎使用一个称为布局(layout)的内部概念。很多的ie下的css bug都与其息息相关。所以理解这个概念以及它如何影响CSS是有捂助的。

什么是布局(layout)

“Layout”是一个 IE 的

阅读更多»

CSS清除浮动的方法详解

CSS清除浮动的方法详解

浮动 Floats 是 CSS 中的一种布局方式。它的渲染位置在行框与包含块之间,这样就可以使行框内文字与浮动元素不重叠并且环绕它显示。在布局过程中也经常会使用它来达到左右并排布局的效果。但是,由于浮动特性,容器如果没有明确设定高度,会依照普通流内元素高度设置,这样就会导致脱离普通流的浮动元素溢出容器,影响其后元素布局。

我们将现有已知的清楚浮动元素方法罗列下:

采用一个HTML标签,以及css

阅读更多»

CSS float与布局详解

CSS float与布局详解

学习CSS大家可能和我一样,都是自学,然后碰到问题,就度娘、谷哥找解决方案,最后虽然都能解决问题,但是久了之后总觉得哪里不对劲,总觉得少了什么。后来我看到W3C对各个属性的详细解释才发现少了什么:基本概念。就像看到有篇文章讲的一个经历:作者说自己面试了一个从事5年js工作的人,然后招至麾下,虽然她自认为javascript技能非常好,但是不久发现她这个手下其实对javascript知之甚少,虽然都

阅读更多»

CSS 三种定位方式以及格式化上下文详解

CSS 三种定位方式以及格式化上下文详解

CSS中影响布局的最重要因素便是定位体系,在布局时,根据三种定位体系定位可分为,常规流、浮动和绝对定位。

而格式化上下文指的是初始化元素定义的环境。包含两个要点,元素定义的环境初始化

在 CSS 中,元素定义的环境有两种,一种是块格式化上下文( Block formatting context ),另一种是行内格式化上下文( Inline formatting context )。 这两种上下

阅读更多»

1