XHTML-CSS写作建议
· 所有的xhtml代码小写
· 属性的值一定要用双引号("")括起来,且一定要有值
· 每个标签都要有开始和结束,且要有正确的层次
· 空元素要有结束的tag或于开始的tag后加上"/"
· 表现与结构完全分离,代码中不涉及任何的表现元素,如style、font、bgColor、border等
· <h1>到<h5>的定义,应遵循从大到小的原则,体现文档的结构,并有利于搜索引擎的查询。
· 给每一个表格和表单加上一个唯一的、结构标记id
· 给重要的区块加上注释,如:
· 给图片加上alt标签
· 所有的标签必须进行合理的嵌套
· 根元素前必须有元素,宣告使用那一种DTD
XHTML1 Transitional: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
· 根元素必须有xmlns属性来指定使用http://www.w3.org/1999/xhtml的namespace
CSS样式表规范:(我们这里的规范,如有不妥,指正一下哦)
· id和class命名采用该版块的英文单词或组合命名,每个单词都是小写,用下划线连接起来,如:content_main(主要内容区域)
· CSS样式表各区块用注释说明
· 使用英文命名原则
· 尽量不缩写,除非一看就明白的单词
CSS命名规范:(我们这里的规范,如有不妥,指正一下哦)
|
DIV
|
CSS名称
|
说明
|
|
网站公用相关
|
|
Container div
|
#wrapper
|
容器
|
|
Header or banner div
|
#header
|
页头部分
|
|
Main or global navigation div
|
#main_nav
|
主导航
|
|
Menu
|
#menu
|
菜单
|
|
Sub Menu
|
#sub_menu
|
子菜单
|
|
Left or right side columns
|
#sidebar
|
左边栏或右边栏
|
|
Main div
|
#main
|
页面主体
|
|
Content div
|
#content
|
内容部分
|
|
The main content area
|
#content_main
|
主要内容区域
|
| Block div
|
#block
|
一块区域
|
|
Footer div
|
#footer
|
页脚部分
|
|
Tag
|
#tag
|
标签
|
|
Message
|
#msg #message
|
提示信息
|
|
Tips
|
#tips
|
小技巧
|
|
Vote
|
#vote
|
投票
|
|
Friend Link
|
#friendlink
|
友情连接
|
|
Title
|
#title
|
标题
|
|
Summary
|
#summary
|
摘要
|
|
Sub-navigation list
|
#sub_nav
|
二级导航
|
|
Search input
|
#search_input
|
搜索输入框
|
|
Search output
|
#search_output
|
搜索输出和搜索结果相似
|
|
Search
|
#search
|
搜索
|
|
Search results
|
#search_results
|
搜索结果
|
|
Copyright information
|
#copyright
|
版权信息
|
|
brand
|
#branding
|
商标
|
|
branding-logo
|
#logo
|
LOGO
|
|
Site information
|
#siteinfo
|
网站信息
|
|
Copyright information etc.
|
#siteinfo_legal
|
法律声明
|
|
Designer or other credits
|
#siteinfo_credits
|
信誉
|
|
Join us
|
#joinus
|
加入我们
|
|
Partnership opportunities
|
#partner
|
合作伙伴
|
|
Services
|
#service
|
服务
|
|
Regsiter
|
#regsiter
|
注册
|
|
Status
|
#status
|
状态
|
|
电子贸易相关
|
|
Products
|
.products
|
产品
|
|
Products prices
|
.products_prices
|
产品价格
|
|
Products description
|
.products_description
|
产品描述
|
|
Products review
|
.products_review
|
产品评论
|
|
Editor's review
|
.editor_review
|
编辑评论
|
|
New release
|
.news_release
|
最新产品
|
|
Publisher
|
.publisher
|
生产商
|
|
Screen shot
|
.screenshot
|
缩略图
|
|
FAQ
|
.faqs
|
常见问题
|
|
Keyword
|
.keyword
|
关键词
|
|
Blog
|
.blog
|
博客
|
|
Forum
|
.forum
|
论坛
|
样式文件命名:
主要的 master.css
布局,版面 layout.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css
提交 submit.css
文本框 textbox.css
统计 count.css
样式文件布局:
div:主要用于布局,分割页面的结构
ul/ol:用于无序/有序列表
span:没有特殊的意义,可以用作排版的辅助,然后在css中定义span
h1-h6:标题
h1-h6: 根据重要性依次递减
h1:最重要的标题
label:为了使你的表单更有亲和力而且还能辅助表单排版的好东西
fieldset & legend:fildset套在表单外,legend用于描述表单内容。
dl,dt,dd:当页面中出现第一行为类似标题/简述,然后下面为详细描述的内容时应该使用该标签
样式自定义命名:
根据w3c网站上给出的,最好是用意义命名
posted @ 2008-04-25 12:46
任力 阅读(272)
评论(11) 编辑 收藏 所属分类:
D、Web Standard