欢迎光临
我们一直在努力

web标准化设计:常用的css命名规则_css教程

建站超值云服务器,限时71元/月

  常用的CSS命名规则


  头:header


  内容:content/container


  尾: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


  (二)注释的写法:


  /* Footer */


  内容区


  /* End Footer */


  (三)id的命名:


  (1)页面结构


  容器: container


  页头:header


  内容:content/container


  页面主体:main


  页尾:footer


  导航:nav


  侧栏:sidebar


  栏目:column


  页面外围控制整体布局宽度:wrapper


  左右中:left right center


  (2)导航


  导航:nav


  主导航:mainbav


  子导航:subnav


  顶导航:topnav


  边导航: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


  (四)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

赞(0)
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com 特别注意:本站所有转载文章言论不代表本站观点! 本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。未经允许不得转载:IDC资讯中心 » web标准化设计:常用的css命名规则_css教程
分享到: 更多 (0)