关于命名规范【css笔记】

外套 wrap(用于最外层)

头部 header(用于头部)

主要内容 main(用于主体内容[中部])

左侧 mainLeft(左侧布局)

右侧 mainRight(右侧布局)

导航条 nav(网页菜单导航条)

内容 content(用于网页中部主体)

底部 footer(用于底部)

id常用命名(驼峰命名):

#container,#content(容器,用于最外层)

#head, #header(页头部分)

#foot, #footer(页脚部分)

#nav(导航)

#mainNav(主导航)

#subNav(子导航)

#leftSideBar,#rightSideBar(左,右导航)

#subNav(二级导航)

#menu(菜单)

#subMenu(子菜单)

#sideBar(侧栏)

#tag(标签)

#msg, #message(提示信息)

#searchInput(搜索输入框)

#hot(热门热点)

#drop(下拉)

#dorpMenu(下拉菜单)

#login(登录)

#register(注册) 

class命名(小写class_name下划线):

.left .right  .center(居左、中、右)

.banner(广告条)

.master(主要的)

.base(基本共用)

.icon(图标)

.menu_content(菜单内容)

.current(当前的)

.tab(标签页)

列定义:

.column_1of3(三列中的第一列)

.column_2of3(三列中的第二列)

.column_3of3(三列中的第三列)

1)颜色:使用字母"c"加颜色的英文名称或者16进制代码,深色用"cd",浅色用"cl"

例:

.cd_red{color:#cc0000;}

.cl_red{color:#ff9900;}

.c_f60 { color: #f60; }

.c_999 { color: #999; }

2)字体大小,使用"font+尺寸代号"或者使用"font+字体大小"作为名称

例:

.font_12px { font-size: 12px; }

.font_9pt {font-size: 9pt; }

3)对齐样式,使用对齐方法加对齐目标的英文名称

例:

.float_left{float:left; }

.valign_middle{vertical-align:middle;}

关于CSS书写顺序:

位置属性(position, top, right, z-index, display, float等);

大小,边距(width, height, padding, margin);

文字系列(font, line-height, letter-spacing, color- text-align等);

背景(background, border等);

其他(animation, transition等);

注释:

/* Footer */ 
  内容区 
/* End Footer */ 

“想要越幸运,就要越努力”
原文地址:https://www.cnblogs.com/HollyLearning/p/5306386.html