CSS 命名规范
CSS 命名规范
XHTML-CSS写作建议
所有的xhtml代码小写
属性的值一定要用双引号("")括起来,且一定要有值
每个标签都要有开始和结束,且要有正确的层次
空元素要有结束的tag或于开始的tag后加上"/"
表现与结构完全分离,代码中不涉及任何的表现元素,如style、font、bgColor、border等
<h1>到<h5>的定义,应遵循从大到小的原则,体现文档的结构,并有利于搜索引擎的查询。
给每一个表格和表单加上一个唯一的、结构标记id
给重要的区块加上注释,如:
给图片加上alt标签
所有的标签必须进行合理的嵌套
根元素前必须有元素,宣告使用那一种DTD
根元素必须有xmlns属性来指定使用http://www.w3.org/1999/xhtml的namespace
CSS样式表规范:
id和class命名采用该版块的英文单词或组合命名,并第一个单词小写,第二个单词首个字母大写,如:newRelease(最新产品
/new+Release)
CSS样式表各区块用注释说明
尽量使用英文命名原则
尽量不加中杠和下划线
尽量不缩写,除非一看就明白的单词
CSS命名规范:
DIV
CSS名称
说明
网站公用相关
Container div
#container
容器
Layout
#layout
布局
Header or banner div
#head, #header
页头部分
Footer div
#foot, #footer
页脚部分
Navigation list
#nav
主导航
Sub-navigation list
#subNav
二级导航
Menu
#menu
菜单
Sub Menu
#submenu
子菜单
Left or right side columns
#sidebar_a, #sidebar_b
左边栏或右边栏
Main div
#main
页面主体
Tag
#tag
标签
Message
#msg #message
提示信息
Tips
#tips
小技巧
Vote
#vote
投票
Friend Link
#friendlink
友情连接
Title
#title
标题
Summary
#summary
摘要
Search input
#searchInput
搜索输入框
Search output
#search_output
搜索输出和搜索结果相似
Search
#search
搜索
Search bar
#searchBar
搜索条
Search results
#search_results
搜索结果
Copyright information
#copyright
版权信息
brand
#branding
商标
branding-logo
#logo
LOGO
Site information
#siteinfo
网站信息
Copyright information etc.
#siteinfoLegal
法律声明
Designer or other credits
#siteinfoCredits
信誉
Join us
#joinus
加入我
相关文档:
人一旦习惯了某些东西就很难去改,以及各种各样的原因,新的浏览器越来越多,而老的总淘汰不了。增长总是快于消亡导致了浏览器兼容是成了谈不完的话题。说到浏览器兼容,CSS HACK自然而然地被我们想起。今天,我们通常都有一个团队或者将有一个团队的人在一个公司里面做相同的事,需要我们有统一的规范来进行Coding,以方 ......
1 针对firefox ie6 ie7的css样式
现在大部分都是用!important来hack,对于ie6和firefox测试可以正常显示,
但是ie7对!important可以正确解释,会导致页面没按要求显示!找到一个针
对IE7不错的hack方式就是使用“*+html”,现在用IE7浏览一下,应该没有问题了。
现在写一个CSS可以这样:
#1 { color: #33 ......
首先一点需要知道,
每个浏览器都有自己默认的默认样式,为了让页面内容显示在浏览器中所希望的位置,而不是继承默认样式,就需要在body选择器中重新设定margin和padding的属性值。
如下所示:
body
{
margin:0;
border:0;
}
其次,练习时用这个例子:
html内容:
<body >
&nbs ......
样式选择符命名
选择符以类型分,同类放一起,类的定义顺序以HTML中实际的顺序为参考,以方便查找为主, 使用类似下面的规则:
[模块前缀 | 类型 | 作用]_[名称]_[状态 | 位置]
约定模块、类型、状态、位置等的所使用的单词或其缩写,保持上面的顺序,尽量保持在两到三个单词说清用途。
通用名词缩写
设置
set
......
查看原文:http://www.csswang.com/css/110.html
导航结构在网站设计中是起到决定性作用的,导航菜单/栏常常通过颜色、排版、形状和一些图片来帮助网站创造更好的视觉和感受,它是网页设计的关键元素。
虽然网站导航菜单的外观是网页设计中关系到整个设计成败与否的关键,但视觉效果也不能影响到网站可用性。最理想的 ......