CSS HTML 命名规则（转发）
CSS命名规则
头：header
内容：content/containe
尾：footer
导航：nav
侧栏：sidebar
栏目：column
页面外围控制整体布局宽度：wrapper
左右中：left right center
登录条：loginbar
标志：logo
广告：banner
页面主体：main
热点：hot
新闻：news
下载：download
子导航：subnav
菜单：menu
子菜单：submenu
搜索：search
友情链接：friendlink
页脚：footer
版权：copyright
滚动：scroll
标签页：tab
文章列表：list
提示信息：msg
小技巧：tips
栏目标题：title
加入：joinus
指南：guild
服务：service
注册：regsiter
状态：status
投票：vote
合作伙伴：partner
XHTML文件中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
1.CSS ID 的命名
外 套： wrap
主导航： mainnav
子导航： subnav
页 脚： footet
整个页面： content
页 眉： header
页 脚： footer
商 标： label
标 题： title
主导航： nav（mainnav/globalnav）
顶导航： topnav
边导航： sidebar
左导航： leftsidebar
右导航： rightsidebar
当前位置： loc
旗 志： logo
标 语： banner
菜单内容1： menu1 content
菜单容量： menu container
子菜单： submenu
边导航图标：sidebarIcon
注释： note
面包屑： breadcrumb(即页面所处位置导航提示）
容器： container
内容： content
搜索： search
登陆： Login
功能区： shop(如购物车，收银台)
当前的 current
网站公用相关
Container div #container 容器
Header or banner div #header 页头部分
Main or global navigation div #main-nav 主导航
Menu #menu 菜单
Sub Menu #submenu 子菜单
Left or right side columns #sidebar-a, #sidebar-b 左边栏或右边栏
Main div #main 页面主体
Content div #content 内容部分
The main content area #content-main 主要内容区域
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 #branding-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 论坛
2.另外在编辑样式表时可用的注释可这样写：
<-- Footer -->
内容区
<-- End Footer -->
3.样式文件命名
主要的 master.css
布局，版面 layout.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css
如<area shape="rect" coords="703,3,750,26" href="#top">
HTML <area> 标签
定义和用法
定义图像地图中的某个区域。
HTML与XHTML之前的差异
在HTML中，<area>没有结束标签。
在XHTML中，<area>必须被正确地关闭。
提示和注释：
此元素永远被嵌套在<map>标签内部。
注释：<img>中的usemap属性可引用<map>中的id或name属性（由浏览器决定），所以我们需要同时向<map>添加id和name两个属性。
必需的属性
DTD指示此属性允许在哪种DTD中使用。S=Strict, T=Transitional, and F=Frameset. 属性 值 描述 DTD
alt text 定义此区域的替换文本 STF
可选的属性
属性 值 描述 DTD
coords 如果shape="rect" 那么 coords="left,top,right,bottom"
如果shape="circ" 那么 coords="centerx,centery,radius"
如果shape="poly" 那么 coords="x1,y1,x2,y2,..,xn,yn"
Specifies the coordinates for the clickable area STF
href URL 定义此区域的目标URL STF
nohref true
false
从图像地图排除某个区域 STF
shape rect
rectangle
circ
circle
poly
polygon
定义区域的形状 STF
target _blank
_parent
_self
_top
在何处打开目标URL.
_blank - 目标URL会在新窗口打开
_self - 当其被点击时，目标URL会在同一框架中打开
_parent - 目标URL会在父框架中打开
_top - 目标URL会在整个的窗口中打开
TF
标准属性
id, class, title, style, dir, lang, xml:lang, tabindex, accesskey
如需完整的描述，请访问标准属性。
事件属性
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, onfocus, onblur
如需完整的描述，请访问事件属性。
创建图像地图
本例显示如何创建带有可供点击区域的图像地图。其中的每个区域都是一个超级链接。
我按照他上面的意思：如果shape="rect" 那么 coords="left,top,right,bottom" 就一位是距离她所在位置的左上右下四边的距离，结果试了半天也没搞出来，最后还是给弄明白了，他所指的这四个距离，比如左右两边，他是以一边为基准的，就好比我们有个大区域，而我们要在这个大区域里用到AREA，那么他要表示的左右两边距离是以大区域的左边为基准的，小区域的左边距大区域的左边距离有多少，就表示left，小区域的右边距大区域的左边距离有多少，就表示right，那么上下呢，就是以大区域的上边为基准，小区域的上边距大区域的上边距离有多少，就表示top，小区域的下边距大区域的上边距离有多少，就表示bottom。
转发自 http://wenku.baidu.com/view/b3af252558fb770bf78a55e7.html?re=view