CSS-命名总结
CSS书写命名总结
一、命名原则:
不要通过视觉外观来给元素命名,而是根据功能给元素命名。
ID具有唯一性,Class具有可重复性。让所有的Class元素都成为外围ID元素的子级或孙级。
网页模块化,利于网站代码的控制,维护和修改
a.外围架构使用ID控制
b.内部结构使用Class控制
二、命名规则:
?
a.骆驼命名法
指混合使用大小写字母来构成变量和函数的名字,首写字母小写
myData
b.帕斯卡命名法
指混合使用大小写字母来构成变量和函数的名字,首写字母大写
MyData
c.匈牙利命名法
标识符的名字以一个或者多个小写字母开头作为前缀,标识出变量的作用域,类型等。前缀之后的是首字母大写的一个单词或多个单词组合或者符号,该单词要指明变量的用途。
txtMyData
d.下划线或中划线命名法
树状结构的命名
层叠式命名
每一个逻辑断点都有一个下划线或中划线来标记
DWMenu_Insert_Animals
DWMenu_Insert_Animals_Dog
DWMenu_Insert_Animals_Cat
DWMenu_Insert_Animals_Monkey
DWMenu-Insert-Animals
DWMenu-Insert-Animals-Dog
DWMenu-Insert-Animals-Cat
DWMenu-Insert-Animals-Monkey
txt-MyData
e.常量命名
SQL_SELECT_CATEGORIES
?
?
三、CSS推荐命名方式
[模块前缀(模块标识|区域标识)]+[功能标识]+[模块后缀(状态|位置|[A-Z]:多风格标识|[0-9]:行标识|[a-z]:列标识)]
wrapperDetails
detailsLeft
detailsRight
section01
section02
section03
sectionYoulike
sectionTel
sectionNews
?
list01
list02
list03
listPro
listArt
listMedia
itemArticle
itemMedia
item
bgBody
btnAdd
btnDel
btnSubmit
btnSubmit01
btnSubmit02
btnSubmit03
?
?
四、常用的样式文件命名
全局样式表:base.css
页面级别样式表:style.css
五、
1、页面框架:
页面主体:container|icontainer
页眉:header
页中:pagebody
侧栏:aside|sidebar
正文:content
页脚:footer
版块:section
行:sectionR|column
栏:sectionC|row
article
dialog
figure
details
datagrid
nav
menu
command
video
audio
2、结构元素
Wrapper
外框:wrapper
外框内套:iWrapper
导航:menu
标签页:tab
容器:pannel
列表:list
内容的内套:inner
上:[top]-[T]
中:[middle]-[M]
下:[bottom]-[B]
左:[left]-[L]
中:[center]-[C]
右:[right]-[R]
多行多列:[part]-[P]
3、模块item
?
元素选择:
一行多列:li + 属性命名?? list控制
一行两列和多行一列:dl dt dd + 属性命名 list控制
多行多列:div????????? item控制
三种状态:[A][B][C][on]
Layout-版式:
上:[top]-[T]-[IT]
中:[middle]-[M]-[IM]
下:[bottom]-[B]-[IB]
左:[left]-[L]-[IL]
中:[center]-[C]-[IC]
右:[right]-[R]-[IR]
多行多列:-[part]-[P]
Property-属性命名:
Profile-色彩|背景
六、网站常用模块中英文对照表
版权:copyright
导航:nav
顶导航:topNav
主导航:mainNav
子导航:subNav
用户导航:userNav
菜单:menu
主菜单:mainMenu
子菜单:subMenu
右键菜单:contentMenu
快捷菜单:shortcutMenu
搜索:search
登录:login
登录条:loginbar
功能区:shop
加入:joinus
指南:guild
服务:service
热点:hot
新闻:news
下载:download
注册:regsiter
状态:status
投票:vote
合作伙伴:partner
友情链接:friendlink
网站导航 Site Map
公司简介 Profile or Company
公司设备 Equipment Equipment
公司荣誉 Glories Glories
企业文化 Culture Culture
产品展示 Product Product
资质认证 Quality Certification
企业规模 Scale Scale
营销网络 Sales Network
组织机构 organization organization
合作加盟 Join In Cooperation
技术力量 Technology Technology
经理致辞 Manager`s oration
发展历程 Development History
工程案例 Engineering Projects
业务范围 Business Scope
分支机构 Branches
供求信息 Supply & Demand
经营理念 Operation Principle
产品销售 Sales Sales
联系我们 Contact Us Contact Us
信息发布 Information Information
返回首页 Homepage Homepage
产品定购 order order
分类浏览 Browse By Category
电子商务 E-business
公司实力 Strength Strength
版权所有 Copy Right
友情连结 Hot Link
应用领域 Application Fields
人力资源 Human Resource Hr
领导致辞 Leader`s oration
企业资质 Enterprise Qualification
行业新闻 Trade News
行业动态 Trends
客户留言 Customer Message
客户服务 Customer Service
新闻动态 News & Trends
公司名称 Company Name
销售热线 Sales Hot-Line
联系人 Contact Person
您的要求 Your Requirements
建设中 In Construction
证书 Certificate Certificate
地址 ADD Add
邮编 Postal Code Zipcode
电话 TEL Tel
传真 FAX Fax
产品名称 Product Name
产品说明 Description Description
价格 Price
品牌 Brand
规格 Specification
尺寸 Size
生产厂家 Manufacuturer Manufacturer
型号 Model
产品标号 Item No.
技术指标 Technique Data
产品描述 Description
产地 Production Place
销售信息 Sales Information
用途 Application
论坛 Forum
在线订购 On-line order
招商 Enterprise-establishing
?
招标 Bid Inviting
综述 General
业绩 Achievements
招聘 Join Us
求贤纳士 Join Us
大事 Great Event
动态 Trends
服务 Service
投资 Investment
行业 Industry
规划 Programming
环境 Environment
发送 Delivery
提交 Submit
重写 Reset
登录 Enter
注册 Login
社区 Community
业务介绍 Business Introduction
在线调查 Online Inquiry Inquiry
下载中心 Download
会员登陆 Member Entrance
意见反馈 Feedback
常见问题 FAQ
中心概况 General Profile
教育培训 Education & Training
游乐园 Amusement Park
在线交流 Online Communication
专题报道 Special Report