|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
使页面的字体变得更漂亮,更容易编排,使页面真正赏心悦目。
破洛洛文章简介:HTML和CSS中的视觉语义.
你和用户之间的网站仓库(简化版)
在TXJS年夜会的最初一天,一个开辟者问我:面向工具的CSS没有给你留下一年夜堆基于体现的class名? 收集仓库中的每层都有它本人的布局。你不会希冀将数据库架构用于构建PHP两头件,人们关于HTML和CSS的希冀是一样一样的。HTML必要用一种能代表数据或内容的成心义的器材来誊写,也就是我所谓的代码语义。HTML中的代码语义关于可移植性和易用性都是极其主要的。另外一方面,CSS在仓库中的确是一个自力的层,它必要能反应页面的视觉语义的属于本人的系统布局。
视觉语义形貌在页面计划中的全体反复形式。他们刻画了你的网站的基础构成部分。现实上,他们常常只必要少量的修正就可以轻松的完成跨站点使用。视觉语义,纷歧定要绑缚到HTML语义,由于你必要一个切合每层仓库的详细需求的架构。
从款式中剥离模板布局
一样,很多PHP开辟职员想要婚配CSS和HTML架构到PHP。也许实验将你最熟习的某一层笼统使用到他们你会以为更具应战?对这一点儿我感应很内疚。在我在Facebook的时分,我但愿PHP层能婚配CSS层。还好Facebook有一些伶俐的开辟者勒住了并帮我促进了了解。
倔强的把CSS和HTML塞到PHP内里能够避免代码太单调(DRY)并终极招致代码痴肥,由于的CSS和HTML必要比PHP更仔细的工具布局。现实上,PHP的模板不是生成符合的,由于每一个模板包括了很多分歧的HTML,和以分歧的体例相分离的CSS工具。
视觉语义!=基于体现的类
必要注重的主要的是,我不是倡议相似“giantBlueHeading”的类名。类名必要体现你要界说的工具布局,而不是特定的视觉类的名。比方,我常常选择好记的对照笼统的类名,如“media”很简单记着。media块由一个流动宽度的图片或Flash和一些笔墨或其他内容组合。
media块可用于很多分歧的情形,比方,组合一个图标和一个链接或团体材料图片和用户名。详细用例是从工具布局平分离出来的。HTML能够被看做是CSS工具的实例。
该media块的代码,和很多其他基础的工具都能够在OOCSS开源项目中找到。
PS:假如你对OOCSS不太熟习,能够浏览一下OOCSS的FAQ,和99CSS对该FAQ的中文翻译
本文译自:VisualSemanticsinHTMLandCSS
原NicoleSullivan
中文原文:HTML和CSS中的视觉语义
请尊敬版权,转载请说明出处,多谢!</p>
在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。 |
|