# black-css-guidebook

**Repository Path**: yutaoj/black-css-guidebook

## Basic Information

- **Project Name**: black-css-guidebook
- **Description**: 📚 CSS 知识图谱 新特性、属性、布局、响应式、动画
- **Primary Language**: TypeScript
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-07-09
- **Last Updated**: 2023-07-09

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# CSS GuideBook

## 目录

- 基础概念
  - [选择符](basement/selector.md)
  - [优先级](basement/specificity.md)
  - [取值与单位](basement/values-and-units.md)
- 属性
  - [定位](properties/location.md)
  - [盒子](properties/box.md)
  - [修饰](properties/decoration.md)
  - [内容](properties/content.md)
  - [背景](properties/background.md)
  - [变形](properties/transform.md)
  - [动画](properties/animation.md)
  - [过渡](properties/transition.md)
  - [Hack](properties/hack.md)
- 布局
  - [盒模型](layout/box-model.md)
  - [块级格式上下文](layout/bfc.md)
  - 基础布局
    - [内联块级布局](layout/inline-block.md)
    - 文档流布局
    - 定位布局
    - 浮动布局
    - [清除浮动](layout/clear-float.md)
    - [弹性布局](layout/flex-box.md)
    - 表格布局
  - 居中布局
    - [水平居中](layout/center/center-horizontally.md)
    - [垂直居中](layout/center/center-vertically.md)
    - [水平垂直居中](layout/center-both-vertically-and-horizontally.md)
  - 多栏布局
    - [双栏布局](layout/double-columns-layout.md)
    - [三栏布局](layout/three-columns-layout.md)
    - 多栏布局
  - 网格布局
    - 网格布局
    - 显式网格属性
    - 隐式网格属性
    - 网格布局术语
    - 网格布局应用
- 工程化
  - 静态资源
    - 字体文件（WebFont or Assets）
    - Sprite
  - 预编译
    - Less
    - Sass
    - CoffeScript
  - 样式方案
    - css modules
    - stylus
    - css-nano
    - postcss
    - css in js
    - compass
- 响应式开发
  - 常见设备宽高
  - Flex 弹性盒布局
  - 媒体查询（Media Query）
  - 用 REM 开发响应式设计
  - 多列布局（Multiple Columns）
- 前端性能优化
- 浏览器兼容
  - CSS HAck
- 优质工具网站推荐

## 参考资料

关于 CSS 详细信息（包括语法解释、兼容性和示例等）推荐查询以下网站：

- [Web 前端开发参考手册系列 CSS 参考手册](http://css.doyoe.com/)
- [MDN web docs #CSS](https://developer.mozilla.org/zh-CN/docs/Web/CSS)
- [W3Help](http://w3help.org/zh-cn/kb/)
- [CSS Properties Reference 样式表属性](http://www.divcss5.com/shouce/)