css规范-根据w3c标准制定

css规范-根据w3c标准制定

ID:13709706

大小:58.00 KB

页数:10页

时间:2018-07-24

css规范-根据w3c标准制定_第1页
css规范-根据w3c标准制定_第2页
css规范-根据w3c标准制定_第3页
css规范-根据w3c标准制定_第4页
css规范-根据w3c标准制定_第5页
资源描述:

《css规范-根据w3c标准制定》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库

1、由于项目中编写文档结构、编写CSS的人员较多,并与程序员协同工作,所以就需要统一开发规范,根据XHTMl和CSS编织的规范和大多人的习惯,整理了以下针对本项目的一个简单的开发规范:一、CSS文件及样式命名1、CSS文件命名规范全局样式:global.css;框架布局:layout.css;字体样式:font.css;链接样式:link.css;打印样式:print.css;2、CSS样式命名规范本人建议:用字母、_号工、-号、数字组成,必须以字母开头,不能为纯数字。为了开发后样式名管理方便,大家请用有意义的单词

2、或缩写组合来命名,让同事一看就明白这样式大概是哪一块的,这样就节省了查找样式的时间,例如:头部样式用header,头部左边,可以用header_left或header_l,还有如果是列结构的可以这样——box_1of3(三列中的第一列),box_2of3(三列中的第二列)、box_3of3(三列中的第三列),其它的我就不一一举例了,大家按以上规律去命名就好。下面列出一些常用的命名单词方便大家使用:(以后大家工作过程中慢慢把自己积累的单词都共享出来,那大家的命就会更加统一了,就不会有一义多词的情况了。)容器:co

3、ntainer/box头部:header主导航:mainNav子导航:subNav顶导航:topNav网站标志:logo大广告:banner页面中部:mainBody底部:footer菜单:menu菜单内容:menuContent子菜单:subMenu子菜单内容:subMenuContent搜索:search搜索关键字:keyword搜索范围:range标签文字:tagTitle标签内容:tagContent当前标签:tagCurrent/currentTag标 题:title内容:content列表:list

4、当前位置:currentPath侧边栏:sidebar图标:icon注释:note登录:login注册:register列定义:column_1of3(三列中的第一列)column_2of3(三列中的第二列)column_3of3(三列中的第三列)二、id和class的使用及区别我们知道在样式表定义一个样式的时候,可以定义id也可以定义class,例如:ID方法:#test{color:#333333},在页面中调用内容

CLASS方法:.test{color:#333333

5、},在页面中调用内容

id一个页面只可以使用一次,class可以多次引用。我在页面中用了多个相同id在IE中显示也正常,id和class好象没什么区别,用多个相同id有什么影响吗?页面存在多个相同的ID影响就是不能通过W3的校验。在页面显示上,目前的浏览器还都允许你犯这个错误,用多个相同ID“一般情况下”也能正常显示。但是当你需要用JavaScript通过id来控制这个div,那就会出现错误。id是一个标签,用于区分不同的结构和内容,就象你的名字,如果一个屋子有2个人同

6、名,就会出现混淆;class是一个样式,可以套在任何结构和内容上,就象一件衣服;概念上说就是不一样的:id是先找到结构/内容,再给它定义样式;class是先定义好一种样式,再套给多个结构/内容。也就是说建议大家在写XHML+CSS时如果是维一的结构定位的就用id,否则就用class吧(这样让出非结构定位的div块的id让程序员自己定义使用)web标准希望大家用严格的习惯来写代码。三.使用css缩写使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。常用的css缩写的主要规则:颜色16进制的色彩值,如果每两位的

7、值相同,可以缩写一半,例如:#000000可以缩写为#000;#336699可以缩写为#369;盒尺寸通常有下面四种书写方法:property:value1;表示所有边都是一个值value1;property:value1value2;表示top和bottom的值是value1,right和left的值是value2property:value1value2value3;表示top的值是value1,right和left的值是value2,bottom的值是value3property:value1value2

8、value3value4;四个值依次表示top,right,bottom,left方便的记忆方法是顺时针,上右下左。具体应用在margin和padding的例子如下:margin:1em02em0.5em;边框(border)边框的属性如下:border-width:1px;border-style:solid;border-color:#000;可以缩写为一句:border:1pxs

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。