本文详细介绍了CSS中 FormattingModel、BoxModel、Typographic 和 Visual 相关属性的顺序，以及常见页面元素的命名规范，如header、nav、content等，旨在提升代码的可读性和维护性。同时，强调了在前端开发中遵循一定的样式书写顺序和组件命名的重要性。
CSS 书写顺序
- Formatting Model 相关属性包括：position / top / right / bottom / left / float / display / overflow 等
- Box Model 相关属性包括：border / margin / padding / width / height 等
- Typographic 相关属性包括：font / line-height /text-align / word-wrap 等
- Visual 相关属性包括：background / color /
transition / list-style 等
命名规则
| 命名 | 解释 |
|---|---|
| header | 头部 |
| nav | 导航 |
| sub-nav | 子导航 |
| menu | 菜单 |
| sub-menu | 子菜单 |
| man | 主体 |
| sidebar | 侧边栏 |
| footer | 底部 |
| wrap | 外层容器 |
| content | 内容 |
| container | 容器 |
| login-bar | 登录栏 |
| regsiter | 注册 |
| banner | 焦点图 |
| news | 新闻 |
| status-bar | 状态栏 |
| hot | 热点 |
| audio | 音频 |
| video | 视频 |
| image | 图像 |
| photo | 图片 |
| music | 音乐 |
| list | 列表 |
| item | 项目 |
| copyright | 版权 |
| title | 标题 |
| edit | 编辑 |
| update | 更新 |
| datetime | 时间 |
| tips | 小提示 |
扫一扫
3534
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
