女王控的博客

CSS世界

7 篇文章

CSS世界流的破坏与保护

魔鬼属性 float float 的本质与特性 浮动的本质就是为了实现文字环绕效果。 包裹性; 块状化并格式化上下文; 破坏文档流; 没有任何 margin 合并; 所谓“包裹性”,由“包裹”和“自适应性”两部分组成。 包裹。假设浮动元素父元素宽度 200px,浮动元素子元素是一个 128px 宽度的图片,则此时浮动元素宽度表现为“包裹”,就是里面图片的宽度 128px,代码如下: 自适应性。如果浮动元素的子元素不只是一张 128px… »

CSS世界强大文本处理能力

line-height 的另外一个朋友 font-size 第 5 章介绍过 line-height 和 vertical-align 的好朋友关系,实际上,font-size 也和 line-height 是好朋友,同样也无处不在,并且纸面上 line-height 的数值属性值和百分比值属性值都是相对于 font-size 计算的,其关系可谓不言而喻。 font-size 和 vertical-align 的隐秘故事 line-height 的部分类别属性值是相对于 font-size… »

CSS世界的层叠规则

所谓“层叠规则”,指的是当网页中的元素发生层叠时的表现规则。 默认情况下,网页内容是没有偏移角的垂直视觉呈现,当内容发生层叠的时候,一定会有一个前后的层叠顺序产生,有点儿类似于真实世界中“论资排辈”的感觉。 z-index 只是 CSS 层叠规则中的一部分 在 CSS 世界中,z-index 属性只有和定位元素(position 不为 static 的元素)在一起的时候才有作用,可以是正数也可以是负数。理论上说,数值越大层级越高,但实际上其规则要复杂很多。 但随着 CSS3 新世界的到来,z… »

CSS世界内联元素与流

块级元素负责结构,内联元素接管内容,而 CSS 世界是面向图文混排,也就是内联元素设计的,由此可见,本章内容在整个 CSS 世界体系中占有非常重要的位置。 字母 x —— CSS 世界中隐匿的举足轻重的角色 字母 x 与 CSS 世界的基线 在各种内联相关模型中,凡是涉及垂直方向的排版或者对齐的,都离不开最基本的基线 (baseline)。例如,line-height 行高的定义就是两基线的间距,vertical-align… »

CSS世界四大盒尺寸

深入理解content content与替换元素 替换元素 根据外在盒子是内联还是块级,元素分为内联元素和块级元素,而根据是否具有可替换内容,我们也可以把元素分为替换元素和非替换元素 通过修改某个属性值呈现的内容就可以被替换的元素称为替换元素,例如img、object、video、iframe或者表单元素textarea、input 特性 内容外观不受页面上CSS的影响,需要类似appearance属性或者浏览器暴露的一些样式接口 有自己的尺寸,在没有明确规定尺寸的情况下,video… »

0%