欢迎访问覃师宁博客!

html与css前端代码书写命名规范

关于html与css前端代码书写命名,每个人前端人员都有自己命名的喜好,那么有没有一些书写的命名规范呢?覃师宁博客这里整理了一些常见的命名规则,有需要的朋友可以进行参考

1、常见页面结构布局命名规范

  1. 页面外围控制整体布局宽度:wrapper
  2. 容器: container  
  3. 页头:header
  4. 页尾:footer
  5. 页面主体:main
  6. 内容:content
  7. 侧栏:sidebar
  8. 区块:section
  9. 文章:article
  10. 左右中:left right center

2、常见页面命名规范

  • 首页:index
  • 列表页:list
  • 内容页:content
  • 标签页:tags 
  • 新闻页:news 
  • 博客页:blog
  • 下载:down
  • 关于我们:about
  • 登陆:login
  • 注册:register/reg

3、页面头部命名

  1. 页头:header
  2. 顶部导航:topnav 
  3. 导航:nav  
  4. 主导航:mainbav  
  5. 子导航:subnav
  6. 菜单:menu  
  7. 子菜单:submenu
  8. 欢迎词:welcome
  9. 收藏网站:collect
  10. 网站标志:logo 
  11. 网站信息:siteinfo 
  12. 登陆:login  
  13. 注册:regsiter  
  14. 搜索:search
  15. 下拉菜单:dorpmenu 

4、页面底部常用命名规范

  • 底部导航:Bottomnav
  • 友情链接:friendlink
  • 联系我们:contact
  • 关于我们:aboutus
  • 关注我们:focusus
  • 加入我们:joinus
  • 合作伙伴:partner 
  • 版权:copyright
  • 备案:beian/icp
  • 服务:service 
  • 指南:guild 
  • 网站地图:sitemap 
  • 统计代码:tongji

5、首页/列表页常见命名规范

  1. 面包屑导航:Breadcrumbs
  2. 推荐:recommend
  3. 头条:headlines
  4. 缩略图:thumbnail
  5. 幻灯片:slide
  6. 横幅:banner
  7. 热点:hot
  8. 最新文章:news
  9. 选项卡:tab
  10. 模块:module
  11. 常见问题:faqs 
  12. 阅读更多:readmore
  13. 详情:detail
  14. 广告:ad
  15. 公告:notice

6、文章内容页常用命名规范

  1. 内容页:content
  2. 标题: title  
  3. 关键词:keyword 
  4. 描述:description
  5. 摘要: summary
  6. 正文:content_text/con_text
  7. 信息:info
  8. 来源:befrom
  9. 作者:writer
  10. 栏目:column
  11. 阅读量:view
  12. 标签:tags
  13. 相关文章:rel_articles
  14. 版权声明:copyright
  15. 上一篇下一篇:previous_post、next_post
  16. 评论:comment
  17. 下载:download
  18. 指南:guild
  19. 提示信息:msg

7、CSS文件命名规范

  • 通用:style.css/commom.css
  • 模块:module.css 
  • 基本共用:base.css 
  • 布局:layout.css 
  • 主题:themes.css 
  • 专栏:columns.css

    猜你喜欢

    无相关信息

文章评论

人参与,共有 0 条评论

为了响应国家网信办《网站要对跟帖评论审核管理规定》,网站评论将审核后发表