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
头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
上一篇:web前端工程师入门须知 推荐
下一篇:关于div+css及Web标准网页的好处
长沙网站设计
- 如何自己建一个网站 自己想建个网站,怎么建
- 如何制作网站免费建站 创建网站免费注册
- html简单网页代码 html简单网页代码超链接
- dreamweaver网页制作 dreamweaver网页制作模板
- 上海网站建设 上海网站建设制作微信
- 如何制作网站和网页 如何制作一个网页
- html网页制作代码大全 端午节html网页制作代码大
- app开发公司 app开发公司前十名
- html网页制作 html网页制作文字居中
- app制作一个需要多少钱 请人制作一个app多少钱
- 成都网站制作 成都网站制作维护
- 百度建一个网站多少钱 百度做个公司网站要多少
- html+css网页制作成品 web网页制作成品css+javascrip
- html网页制作案例 html网页设计案例
- html+css网页制作成品 web网页制作成品css+javascrip
- 个人网站模板 个人网站模板HTML