第十讲了,应该说Css的基础学习就告一段落了。我们还需要学习的东西很多,我们还没有学习Css+Div的布局呢。不要急,后面一定会学习这项先进技术的,不过不在这个系列里面。
先来说说已经学会的知识如何更好的应用,我们学习了基础、语法,可是还没有在实际的开发中间应用呢。
1、继承
继承是个好东西,但是并不是所有的属性都会继承的,那我们就要问了,那些属性是会继承的,那些属性是不会继承的呢?如果要说清楚这个问题,估计可以写一本参考手册了。我就简单说一下规则,如果你不算太笨的话,应该会举一反三的。大体上,影响你文本外观的样式,如字体颜色(颜色属性)、字体,还有其他和字体有关的属性,如字体大小、字体宽度和字体样式都可以被继承。其他的属性(比如边框)不能被继承,很容易理解吧。
在实际应用中继承有什么样的指导作用呢?举例说明,我们应该把文本的属性设置放在尽量接近树结点的根上,比如整个网站的文本默认设置,放在body结点上,那所有接点的文字都可以得到继承。拥有了继承,又有那些是不应该设置文本属性的呢?比如P、A这样的选择符还要设置文本的属性吗?(并不绝对,以下只是我的思考结果,仅供参考!)我认为就不需要设置文本的属性了。比如选择符A,我们想做的就是转变默认的蓝色和下划线,如果再设置文本的大小和字体,就会覆盖掉上下文中的继承作用。大家肯定不想在标题上显示链接,结果文本和正文的字体、大小一样吧!
从上面的事例是不是应该给我们更多的思考呢?如何充分利用继承来减少对Css的设置将是一个很大的课题。
2、宏观的考虑
Css的设计有很大的门道,个人感觉不亚于程序和数据库的设计,那就说说我对整体Css设计的一些想法。
整体思路:大处着眼,小处着手。首先需要有一个宏观的概念,考虑好通用的样式。整站的文本、默认的标题大小、布局Div的方式等等,你对整个系统有了宏观的了解,才知道那些是应该默认的,那些才要特殊的样式覆盖。比如标题,先要考虑好使用那几号标题,再定义好<h1><h2>这些的默认样式,在那个模块里面如果要换一个样式,就对这个标题使用类来限定。这样的好处,即使其他设计人员在制作页面的时候不清楚,也照样做出正确的页面来。程序的效率来自于团队需要整体思考的东西越少,你作为管理者越成功(当然成功是要靠实力的)。
3、命名
只要是写程序相关的问题,总会涉及到变量的命名,Css也不例外。有一些通用的命名规则还是可以借鉴的,比如不要使用无意义的命名:Object,谁都不能联想到在那里会使用到它!因此有意义的命名是提高程序可读性一大法宝,什么?你想使用更好的一些命名到你的网站上,哈哈,那你就多加练习,不断改进你的网站吧(这些改进可能并不能给客户带来变化,但是你的水平肯定还是会有所变化的!这点相信我没错的)。
有些命名会按照类型来,比如在asp.net开发中的Label控件,喜欢使用lbl作为前缀,个人认为在Css的命名使用这个方式并不好。有一些样式的定义我们不能确定使用在什么选择符上,开始使用在P选择符上,过了一段时间,又要使用在span上,为了规范命名,就需要修改命名,可是你需要冒着修改全站样式的风险来追求命名的规范,大多数人会放弃命名规范。结果后续做开发的人迷糊了,不知道代码错误了还是代码扩展演变的,程序中的遗憾就是这样产生的。说了这么多总结成一句,不要使用类型来命名!应该确定意义来命名,比如给网站的头部命名为MasterHead就不错。
4、适用范围
这一点上有一点像程序中的全局变量,或者是面向对象中继承后的Override。现在程序编译太先进了,编译器会告诉我们写的函数在基类里面是否存在,是否确定要覆盖,Css有这样的功能多好啊(一个邪恶的声音在那里偷笑,你应该可喜没有这样的功能,不然就淹没在Css的继承关系里吧)。因此我们在编写Css样式的时候要清楚地意识到这个样式的使用范围,然后给他个比较合适的使用范围。既要能够应用到这个样式,又尽量使不使用的地方不会误用到。
还是举例说明,在网站的布局中会把页面划分成几个部分,对每个部分的样式进行定义。在网页头部(MasterHead)的列表导航和在左边栏(Sidebar)的列表导航的样式是不一样的,我们应该怎么样来定义限制使用范围呢?#MasterHead ul和#Sidebar ul这样的设置是不是会比导航使用不同的类好一些呢?当然#MasterHead ul.ClassName这样的定义也不错,如果在MasterHead中不止一个列表时这是更好的选择。这样修改程序时,你需要得到的信息量是最少的,自然修改起来也会方便一些,特别是在网站的后期或者维护阶段,你很难保证你的样式修改添加是否会对已经存在的网站造成不必要的影响,一个优秀的Css设计师将会尽量避免这样的事件发生。
该讲的都讲了,希望大家看了以后也能留下自己的宝贵经验。学习需要的就是分享!