CSS高效开发三大方向

css研究方向

大体上CSS的学习可以朝着三个方向进行研究,分别是:

  • 特效(可以学习动画、3D、渐变等)
  • 工程化(可以学习sass、less、postcss等)
  • 布局(可以学习flex、grid、响应式等)

CSS文件划分

TIP

在中大型项目中,一般会对CSS进行文件划分,根据文件的性质与用途,大概会分成:

  • 公共型样式

  • 特殊型样式

  • 皮肤型样式

公共型样式可命名为globa.css或common.css等名字,主要包括网站通用样式编写。例如:重置默认样式

reset、网站通用布局、通用模块和元件、通用响应式系统等

css功能分类

通用模块

通用原件

通用响应式系统

标签默认样式清除

常见的CSS方法论

  • oocss
  • BEM
  • SMACSS
  • Atomic CSS

OOCSS

BEM

SMACSS

样式规范

css样式属性书写顺序

css3浏览器私有前缀写法

类名需要语义化

相关推荐
大江东第一深情8 小时前
Origin 2024 进行语言切换后仍然显示为英文
运维·前端
lxh01138 小时前
最长公共子序列
前端·数据结构
Можно8 小时前
ES6扩展运算符:从基础到实战的全方位解析
前端·javascript
豆苗学前端8 小时前
闭包、现代JS架构的基石(吊打面试官)
前端·javascript·面试
雯0609~8 小时前
uni-app:防止重复提交
前端·javascript·uni-app
2501_918126918 小时前
用html5写一个国际象棋
前端·javascript·css
遇见~未来8 小时前
前端原生能力速查笔记(HTML + 浏览器 API 实战篇)
前端
siroi8 小时前
[捉虫日记] 给 useImperativeHandle 加个空依赖,竟让我 debug n 小时
前端
博客zhu虎康8 小时前
Vue全局挂载Element消息组件技巧
前端·javascript·vue.js
LaoZhangAI8 小时前
Gemini图像生成宽高比教程:10种比例完整配置指南【2025】
前端·后端