HTML,CSS的命名习惯总结

建站知识 2021-07-03 09:08www.168986.cn长沙网站建设
CSS命名规则
头header
内容content/containe
尾footer
导航nav
侧栏sidebar
栏目column
页面外围控制整体布局宽度wrapper
左右中left right center
登录条loginbar
标志logo
广告banner
页面主体main
热点hot
新闻news
下载download
子导航subnav
菜单menu
子菜单submenu
搜索search
友情链接friendlink
页脚footer
版权copyright
滚动scroll
内容content
标签页tab
文章列表list
提示信息msg
小技巧tips
栏目标题title
加入joinus
指南guild
服务service
注册regsiter
状态status
投票vote
合作伙伴partner
XHTML文件中id的命名
(1)页面结构
容器: container
页头header
内容content/container
页面主体main
页尾footer
导航nav
侧栏sidebar
栏目column
页面外围控制整体布局宽度wrapper
左右中left right center
(2)导航
导航nav
主导航mainbav
子导航subnav
顶导航nav
边导航sidebar
左导航leftsidebar
右导航rightsidebar
菜单menu
子菜单submenu
标题: title
摘要: summary
(3)功能
标志logo
广告banner
登陆login
登录条loginbar
注册regsiter
搜索search
功能区shop
标题title
加入joinus
状态status
按钮btn
滚动scroll
标签页tab
文章列表list
提示信息msg
当前的: current
小技巧tips
图标: icon
注释note
指南guild
服务service
热点hot
新闻news
下载download
投票vote
合作伙伴partner
友情链接link
版权copyright
XHTML文件中class的命名
(1)颜色:使用颜色的名称或者16进制代码,如(不建议以表现来命名)
.red { color: red; }
.f60 { color: #f60; }
.ff8600 { color: #ff8600; }
(2)字体大小,直接使用"font+字体大小"作为名称,如
.font12px { font-size: 12px; }
.font9pt {font-size: 9pt; }
(3)对齐样式,使用对齐目标的英文名称,如
.left { float:left; }
.bottom { float:bottom; }
(4)标题栏样式,使用"类别+功能"的方式命名,如
.barnews { }
.barproduct { }
其它相关注意事项
1.一律小写;
2.尽量用英文;
3.不加中杠和下划线;
4.尽量不缩写,除非一看就明白的单词.
主要的 master.css
模块 module.css
基本共用 base.css
布局,版面 layout.css
主题 themes.css
专栏 columns.css
文字 font.css
表单 forms.css
补丁 mend.css
打印 print.css

Copyright © 2016-2025 www.168986.cn 狼蚁网络 版权所有 Power by