有利于SEO的DIV+CSS的命名规则小结
一、CSS文件及样式命名
1、CSS文件命名规范
全局样式:global.css;
框架布局:layout.css;
字体样式:font.css;
链接样式:link.css;
打印样式:print.css;
2、CSS样式命名规范
本人建议:用字母、_号工、-号、数字组成,必须以字母开头,不能为纯数字。为了开发后样式名管理方便,大家请用有意义的单词或缩写组合来命名,让同事一看就明白这样式大概是哪一块的,这样就节省了查找样式的时间,例如:
头部样式用header,头部左边,可以用header_left或header_l,还有如果是列结构的可以这样——box _1of3 (三列中的第一列),box_2of3 (三列中的第二列)、box _3of3 (三列中的第三列),其它的我就不一一举例了,大家按以上规律去命名就好。
下面列出一些常用的命名单词方便大家使用:(以后大家工作过程中慢慢把自己积累的单词都共享出来,那大家的命就会更加统一了,就不会有一义多词的情况了。)
容 器:container/box
头 部:header
主 导 航:mainNav
子 导 航:subNav
顶 导 航:topNav
网站标志:logo
大 广 告:banner
页面中部:mainBody
底 部:footer
菜 单:menu
菜单内容:menuContent
子 菜 单:subMenu
子菜单内容:subMenuContent
搜 索:search
搜索关键字:keyword
搜索范围:range
标签文字:tagTitle
标签内容:tagContent
当前标签:tagCurrent/currentTag
标 题:title
内 容:content
列 表:list
当前位置:currentPath
侧 边 栏:sidebar
图 标:icon
注 释:note
登 录:login
注 册:register
列 定 义:column_1of3 (三列中的第一列)
column_2of3 (三列中的第二列)
column_3of3 (三列中的第三列)
二、id和class的使用及区别
我们知道在样式表定义一个样式的时候,可以定义id也可以定义class,例如:
ID方法:#test{color:#333333},在页面中调用<div id="test">内容<div>
CLASS方法:.test{color:#333333},在页面中调用<div class="test">内容<div>
id一个页面只可以使用一次,class可以多次引用。
我在页面中用了多个相同id在IE中显示也正常,id和class好象没什么区别,用多个相同id有什么影响吗?
页面存在多个相同的ID影响就是不能通过W3的校验。
在页面显示上,目前的浏览器还都允许你犯这个错误,用多个相同ID“一般情况下”也能正常显示。但是当你需要用Java
相关文档:
在网页设计中,table用height:100%是可以整屏的,但需要在网页头部增加:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
后就和没 ......
/* mozilla.org Base Styles
* maintained by fantasai
* (classes defined in the Markup Guide - http://mozilla.org/contribute/writing/markup)
*/
/* Suggested order:
//显示属性
* display
* list-style
* position
* float
* clear
//自身属性
* width
* height
* margin
* padding
* border
* ba ......
CSS语法 (不区分大小写) JavaScript语法 (区分大小写)
border border
border-bottom &nbs ......
起初的HTML的设计只是定义文档内容用,而对于文档布局则由浏览器来完成。后来由于浏览器服务商不断地将新的规范中,使得创建文档内HTML标签添加到HTML容清新独立于表现层的站点越来越复杂。为了解决这个问题,万维网联盟(W3C),肩负起了 HTML 标准化的使命,并在 HTML 4.0 之外创造 ......
三种引用2010-03-14 17:45:36
内联定义>外链引用>内联块定义
1.内联定义
<a stype="XXX">
2 ......