CSS中视觉效果词义不等于根据主要表现的类

2021-01-20 13:58 jianzhan

你和客户之间的网站堆栈(简化版)

 

在TXJS交流会的最终1天,1个开发设计者问我:

朝向目标CSS沒有给你留下1大堆根据主要表现的class名?

互联网堆栈中的每层都有它自身的构造。你不容易期待将数据信息库构架用于搭建PHP正中间件,人们针对HTML和CSS的期待是1样1样的。HTML必须用1种能意味着数据信息或內容的成心义的物品来撰写,也便是我所谓的编码词义。HTML中的编码词义针对可移殖性和易用性全是极其关键的。另外一层面,CSS在堆栈中的确是1个单独的层,它必须能反应网页页面的视觉效果词义的属于自身的管理体系构造。

视觉效果词义叙述在网页页面设计方案中的所有反复方式。她们勾勒了你的网站的基础构成一部分。客观事实上,她们常常只必须少量的改动就可以轻轻松松的完成跨站点运用。视觉效果词义,不1定要捆缚到HTML词义,由于你必须1个合乎每层堆栈的实际要求的构架。

从款式中剥离模版构造

一样,很多PHP开发设计人员要想配对CSS和HTML构架到PHP。也许尝试将你最熟习的某1层抽象性运用到她们你会感觉更具挑戰?对这1点儿我觉得很愧疚。在我在Facebook的情况下,我期待PHP层能配对CSS层。还好Facebook有1些聪慧的开发设计者勒住了并帮我促进了了解。

强硬的把CSS和HTML塞到PHP里边能够避免编码太枯燥乏味(DRY)并最后致使编码臃肿,由于的CSS和HTML必须比PHP更细腻的目标构造。客观事实上,PHP的模版并不是与生俱来适合的,由于每一个模版包括了很多不一样的HTML,和以不一样的方法相融合的CSS目标。

视觉效果词义!=根据主要表现的类

必须留意的关键的是,我并不是提议相近“giantBlueHeading”的类名。类名必须主要表现你要界定的目标构造,而并不是特殊的视觉效果类的名。比如,我常常挑选好记的较为抽象性的类名,如“media”很非常容易记牢。media块由1个固定不动宽度的照片或flash和1些文本或别的內容组成。

media块能用于很多不一样的状况,比如,组成1个标志和1个连接或本人材料照片和客户名。实际测试用例是从目标构造中分刘海离出来的。HTML能够被看做是CSS目标的案例。

media块的编码 ,和很多别的基础的目标都可以以在OOCSS开源系统新项目中寻找 。

PS:假如你对OOCSS不太熟习,能够阅读文章1下OOCSS的FAQ,和99CSS对该FAQ的汉语汉语翻译