css规范整理.docVIP

CSS规范整理 标签:? CSS? 规范? 2009-04-18 08:36 (一)xhtml的规范：1、所有的xhtml代码英文小写2、属性的值一定要用双引号()括起来，且一定要有值3、每个标签都要有开始和结束，且要有正确的层次4、表现与结构完全分离，代码中尽量不涉及任何的表现元素，如style、font、bgColor、border等5、h1到h5的定义，应遵循从大到小的原则，体现文档的结构，并有利于搜索引擎的查询6、给重要的区块加上注释7、图片要加alt注释 (二)CSS的规范：1、id和class命名采用该版块的英文单词或组合命名，并第一个单词小写，第二个单词首个字母大写，如:newRelease（最新产品/new+Release) ,或者用下划线链接new_Release.2、CSS样式表各区块用注释说明 ?? 注释的写法:?? /* Footer */???? 内容区 ?? /* End Footer */ 3、尽量使用英文命名原则，尽量不缩写，除非一看就明白的单词 ?? 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 {?? } (5)页面结构容器：#container布局：#layout头部：#head、#header尾部：#foot、#footer侧栏：#sidebar左边栏：#sidebarLeft右边栏：#sidebarRight页面主体：#main栏目：#column包装/外套：#wrapper、wrap内容：#content (6)导航导航：#nav主导航：#mainNav顶导航：#topNav左导航：leftNav右导航：rightNav下导航：bottomNav二级导航：#subNav菜单：#menu二级菜单：#subMenu下拉：.drop下拉菜单：.dropMenu (7)功能标签：.tab、.tag提示信息：.msg、.message小技巧：.tips注释：.note热点：.hot摘要：.summary帮助：.help投票：.vote指南：.guild商标：.branding标签：.label工具条：.tool、.toolBar 标题：.titleLOGO：.logo搜索：.search搜索条：.searchBar搜索框：.searchBox搜索输入框：.search_input搜索输出框：.search_output搜索结果：.search_results注册：.register登录：.login登录条：.loginBar登录框：.loginBox友情链接：.friendLink、.link广告/标语：.banner版权信息：.copyright加入我们：.joinUs合作伙伴：.partner服务：.service网站地图：.siteMap、.map缩略图：.screenShot产品：products产品价格：products_prices产品描述：products_description产品评论：products_review最新产品：new_products生产商：suppliers、publisher编辑：editor编辑评论：editor_review博客：blog论坛：forum新闻：news下载：download 网站信息：.siteinfo法律声明：.legal信誉：.credits列表：.list (8)其他左中右：left、center、right上中下：top、middle、bottom按钮：btn面包屑：breadcrumb(即页面所处位置导航提示)滚动：scroll当前：current图标：icon箭头：arrow首页：homePage、home二级页面：subPage状态：status常见问题：faqs、questions关键词：keyword (三)