沈阳营销型网站建设 网站优化 seo优化 网络营销 就选AG游戏大厅
咨询热线:024-31656768
首页 关于我们 成功案例 网站建设 SEO优化 全网营销 新闻资讯 联系我们
 

CSS注释、命名、继承性、样式排序等CSS技巧

日期:2012年09月03日 来源:沈阳AG游戏大厅(www.cheeme.com)

 

一、关于注释

在创建xhtml+CSS网站时,CSS中的注释非常重要。在创建CSS样式时,应当保持随手注释的习惯。一般的,我习惯于使用“/* 注释内容 */”的格式来写注释,因为在EditPlus等具有高亮功能的编辑器里,使用C语言中常用的“/***************/”之类的注释是无意义的,没有必要填充大量无意义内容作为分隔。带有注释的文档作为网站的原始CSS文档,在发布网站的时候,可以使用CSS压缩工具压缩CSS,在输出的CSS中去掉注释以提高文件传输效率。 


二、关于命名

在给CSS文件命名的时候,我比较喜欢使用符合语义的英文名或者缩写命名,在非常用部分也许会用部分拼音命名。另外,在某些有从属关系的class里,我可能会使用类似“list_banner”之类的命名,即父元素名加上“_”再加上元素名。

关于命名,可以根据团队设计师的习惯进行协商。但最好在命名之后加上注释,以便将来生成文档备查。

三、关于继承性

在CSS中,要善用继承性。比如在两个嵌套的div中,父元素定义了background-color属性为黑色,如果子元素的背景同为黑色,则不需重复定义。善于利用CSS的继承性可以让代码更有效、更精简。

四、关于CSS定义的层次

在定义CSS中的class时,建议使用层次分明的方式来描述语句。

示例结构: 


以下为引用的内容:
<div id="menu">
  <div class="menulist">
    <div class="selectit"></div>
  </div>
</div> 


示例CSS:

以下为引用的内容:
#menu { ... }
#menu .menulist { ... }
#menu .menulist .selectit { ... } 



在上例中,从最终效果来看,#menu没有必要重复出现,但是实际上如果能够在前面加上#menu,将会让文档的层次更加明了,更利于阅读。 


五、关于样式排序 

在设计CSS样式表时,我们大多是手写代码,这样很容易造成class中的样式排序混乱。比如有几个class中用到了padding、margin、background、color等样式,但是排序的时候,有的class是background比较靠前,有的是margin比较靠前。这样就造成了一定的混乱,容易让思路受挫。我建议个人或者团队的设计师协定一个大致顺序,这样从个别来说看不出太大差别,但从整体上将更加易于阅读和管理,整体效率会提高不少。

比如,我默认将width、height和padding、margin、border等放在较靠前的位置,background其次,然后是控制文本的font、color、text-align等,接着是某些特殊标签才能用到的元素,像list-style等,最后是css滤镜。当遇到特殊情况时(比如CSS某些属性的优先级需要定义)可以灵活处理。


沈阳网站建设选择我们就没错,提供全套的一条龙网站建设和沈阳seo服务,网站维护终身免费,让您最大程度上拥有成功网站优势!网站地图 快速通道

 

 
·网络营销之网站优化推广难点[2018-03-01]
·网站优化中SEO关键词密度到底多少[2018-03-01]
·网站seo黑帽优化手法到底是什么呢[2018-03-01]
·企业公司网站优化四大基本优化准[2018-03-01]
·电商网站优化难度高?支招8点SEO技[2018-03-01]
·网站SEO优化要注意的6个问题[2018-02-01]
·如何对网站栏目进行优化[2018-02-01]
·如何才能加快网站文章的收录[2018-02-01]
·将来网站内容优化的四个方向[2018-02-01]
·网站内容优化建设需要关注的几个[2018-02-01]
·企业网址制作的基本流程[2018-01-24]
·企业网站标题优化注意事项[2018-01-24]
·影响企业网站制作质量的主要因素[2018-01-24]
·要客观认识seo的作用与效果[2018-01-18]
 
  "用诚心做好服务,用实力做好质量!   网站地图  快速通道     电话:024-31656768   手机:13840407908
点击这里给我发消息
点击这里给我发消息