分类: CSS
thumbnail
CSS

CSS盒模型

1. 盒模型定义及分类 当你对一个文档进行布局(laying out)时候, 浏览器引擎会根据CSS-Box模型将所有元素描述为一个盒子, CSS会决定这些盒子的大小, 位置, ……
thumbnail
CSS

圣杯与双飞翼布局

圣杯布局 <div class="container"> <div class="middle">中间内容</div> <div class="left">左侧区域</div> <div class="right">右侧区……
thumbnail
CSS

CSS选择器及权重

1. 选择器有哪些 选择器示例说明通配选择器* {}与任何元素都匹配标签选择器h1 {}选择<h1>标签ID选择器#idName {}选择id为idName的元素类选择器.clas……
thumbnail
CSS

CSS水平垂直居中布局

1.position设为absolute+margin position取值脱离标准流定位元素绝对定位元素定位参照对象static否否否没有relative否是否元素自己原来的位置absolute是是……
thumbnail
CSS

flex布局

1.基础概念: 采用 Flex 布局的元素,称为 Flex 容器(flex container),简称"容器"。它的所有子元素自动成为容器成员,称为 Flex 项目(flex item),简称"……
thumbnail
CSS

BFC的含义及作用

1.BFC是什么 BFC 的全程为块格式化上下文(Block Formatting Context),在 MDN 定义如下: 块格式化上下文(Block Formatting Context,BFC) 是……
thumbnail
CSS

两栏布局与圣杯布局

float+margin-left方案 .wrapper-float { overflow: hidden; // 清除浮动 } .wrapper-float .left { float: left; } .wrapper-float .right { ……
thumbnail
CSS

CSS尺寸单位

em rem vh vw calc(), line-height 百分比 1. px px是像素单位。它是代表显示器上每一个显示的像素点,根据用户屏幕显示器的分辨率决定。 2. em em为……