志在指尖
用双手敲打未来

常用的CSS命名规范大总结

CSS命名一般选用小写英文单词或组合命名,单词与单词之间以”-“切割,并且英文单词不缩写,除非是那种简单一眼看上去就能理解的单词。接下来在文章中分享一些CSS中常用的命名标准,期望对大家有所协助
【推荐课程:CSS教程】
文本命名标准
index.css:一般用于主页建立款式
head.css:头部款式,当多个页面头部设计风格相一起运用。
base.css:共用款式。
style.css:独立页面所运用的款式文件。
global.css:页面款式基础,全局共用款式,页面中必须包含。
layout.css:布局、版面款式,共用类型较多时运用,一般用在主页级页面和产品类页面中
module.css:模块,用于产品类页,也可与其它款式合作运用。
master.css:首要的款式表
columns.css:专栏款式
themes.css:主体款式
forms.css:表单款式
mend.css:补丁,基于以上款式进行的私有化修补。
页面结构命名:
page:代表整个页面,用于最外层。
wrap:外套,将一切元素包在一起的一个外围包,用于最外层
wrapper:页面外围操控全体布局宽度,用于最外层
container:一个全体容器,用于最外层
head,header:页头区域,用于头部
nav:导航条
content:内容,网站中最重要的内容区域,用于网页中部主体
main:网站中的首要区域(表明最重要的一块方位),用于中部主体内容
column:栏目
sidebar:侧栏
foot,footer:页尾、页脚。网站一些附加信息放置区域,(或命名为copyright)用于底部
导航命名:
nav,navbar,navigation,nav-wrapper:导航条或导航包,代表横向导航
topnav:顶部导航
mainbav:主导航
subnav:子导航
sidebar:边导航
leftsidebar或sidebar_a:左导航
rightsidebar或sidebar_b:右导航
title:标题
summary:摘要
menu:菜单,区域包含一般的链接和菜单
submenu:子菜单
drop:下拉
dorpmenu:下拉菜单
links:链接菜单
功用命名:
logo:符号网站logo标志
banner:标语、广告条、顶部广告条
login:登陆,(例如登录表单:form-login)
loginbar:登录条
register:注册
tool,toolbar:工具条
search:查找
searchbar:查找条
searchlnput:查找输入框
shop:功用区,表明现在的
icon:小图标
label:商标
homepage:主页
subpage:二级页面子页面
hot:热门热点
list:文章列表,(例如:新闻列表:list-news)
scroll:翻滚
tab:标签
sitemap:网站地图
msg或message:提示信息
current:当前的
joinus:加入
status:状态
btn:按钮,(例如:查找按钮可写成:btn-search)
tips:小技巧
note:注释
guild:指南
arr,arrow:符号箭头
service:服务
breadcrumb:(即页面所处方位导航提示)
download:下载
vote:投票
siteinfo:网站信息
partner:合作伙伴
link,friendlink:友情链接
copyright:版权信息
siteinfoCredits:诺言
siteinfoLegal:法律信息

未经允许不得转载:IT技术网站 » 常用的CSS命名规范大总结
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

志在指尖 用双手敲打未来

登录/注册IT技术大全

热门IT技术

C#基础入门   SQL server数据库   系统SEO学习教程   WordPress小技巧   WordPress插件   脚本与源码下载