CSS

来自康健生活
跳到导航 跳到搜索

返回上一级

引言

实现

布局

BFC Flex 浮动
stacking context IFC 等高布局
示例 示例 示例

属性

position visibility vertical-align box-shadow
box-sizing font 伪类
transform 示例 示例

函数

calc 示例 示例
示例 示例 示例
示例 示例 示例

变形

拉伸 示例 示例
示例 示例 示例
示例 示例 示例

画图

画圆 三角形 path
示例 示例 示例
示例 示例 示例

关键字

蒙层 文档流 字体
解析方向 层叠上下文 隐藏文本
css联动 示例 示例

问题

margin合并 示例 示例
示例 示例 示例
示例 示例 示例

命名方案

BEM scoped css css modules
css-in-js OOCSS SMACSS
ACSS 示例 示例

项目方案

askgo 示例 示例
示例 示例 示例
示例 示例 示例

CSS

CSS Level 1

REC-CSS1-19961217 REC-CSS1-19990111 REC-CSS1-20080411

CSS Level 2

REC-CSS2-20110607 WD-CSS22-20160412

CSS Level 3

CSS3

CSS Level 4 and beyond

CSS Now

CSS Snapshot 2017

备注

语法糖

cssnext CSS in JS 示例
示例 示例 示例
示例 示例 示例

方案

栅格

栅格布局

1010 示例

标签

span div img
示例 示例 示例
示例 示例 示例

动效

进度条 示例 示例
示例 示例 示例
示例 示例 示例

默认

user agent stylesheet 示例 示例
示例 示例 示例
示例 示例 示例

加载方式

js异步加载CSS 分步渲染 Firefixing
hack flexbox 示例 示例
示例 示例 示例

error

  • 相邻元素margin的自动合并与float
  • margin塌陷
  • h3 标签的 margin-top 自动与父亲节点合并
    父亲节点设置
    overflow: hidden
    
  • display: table-row; border 无效
    父元素添加 display: table; border-collapse: collapse;

测量工具

编辑器

在线编辑