CSS你了解多少?CSS等级趣谈

2016-02-19 15:35 0 1 收藏

下面图老师小编跟大家分享一个简单易学的CSS你了解多少?CSS等级趣谈教程,get新技能是需要行动的,喜欢的朋友赶紧收藏起来学习下吧!

【 tulaoshi.com - Web开发 】

  我们在不断的学习,追求进步与提高,在22333.com中有大量的教程,到底学到什么程度了,到底是不是真的了解CSS,是哪个层次了呢。我们来对照一下。

  第0级:CSS?那不是一个多人射击游戏吗?
  CSS? Isn't that a multiplayer game?
  有些人因为在找CS:S(Counter Strike: Source)这款游戏的资讯而进到#CSS网站。不必担心这些人,他们不可能制作太多网页,所以对网络也不会造成多大伤害。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  第1级:是啊,我偶尔用它来移除连结的底线
  Yeah, I use it to remove underlines on links sometimes
  和第0级的人不同,这些人学过HTML,也制作过几个简单的网站。他们只有在无法使用HTML制作出某些效果时,才会使用CSS,例如移除连结的底线或者设定行高。这些人的网站通常规模不大也没什么访客,所以他们也不会对网络造成太大伤害。

  第2级:不,我不喜欢div元素;表格好用多了!
  No, I don't like divs; tables are much easier to work with
  他们听过使用div元素来设计网页这件事,也花了些时间学习CSS。不过他们很快就放弃了,觉得CSS太难而且支持度不佳,还是宁可用表格排版。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

注意!他们是危险人物!他们在这个领域已经待了一段时间,许多都是网站部门的主管。和他们接触是很重要的,提倡网络标准的人应该多多开导他们,这对网络的意义非同小可。

  第3级:是啊,听说它挺好的,不过我没用它因为……
  Yes I've heard it's good, but I can’t use it because of…
  这些人虽然知道CSS的优点,不过总是基于某些原因而无法使用它,例如他们可能有第2级的上司,或者他们必须考虑到Netscape 4的使用者。
  旧版的浏览器虽然不支持CSS,不过使用者还是可以看见完整的内容。而基于亲和力(accessibility)和易用性(usability)的好 处,CSS可以为网站带来更多访客。把这些优点告诉第3级的开发人员,即使他们不是决策者,或许多少能对第2级的上司发挥点影响力吧。

  第4级:CSS?喔!没错,我用div元素来排版
  CSS? Oh! Yes, I use divs for all my layouts
  在页面中使用过多的div元素反而是这群人的问题,他们会用#toprightredline或是#r5_c7(表示第5列第7栏)这样的方式设定div元 素的id。即使可以通过XHTML 1.1的验证,这种排版方式却无法发挥CSS的优势。荧幕朗读软体(screen readers,视障者使用的浏览器)很难解译这些网页,旧版浏览器也会有同样的问题,网页的内容无法完整显示。而不良的class与id命名方式,也对 于版面的修改造成极大不便。

虽然第4级的人制作的网站仍然很糟,不过由于他们很容易接受新的观念,因此对网络造成的伤害较小。许多所见即所得(WYSIWYG)的编辑器制作出充满div元素的原始码,可能也是误导这群人的原因。幸好这些编辑器已经逐渐改良了,希望这会有助于第4级的人继续往上提升。

  第5级:我用CSS来设计,这比表格好多了,因为……
  I use CSS for design, it's better than tables because of…
  第5级的人知道CSS的优点并乐于使用,虽然有时会遇到些问题,但并不严重。他们也能运用长期的CSS工作经验,与人辩论为什么要将网页的结构与设计分开。我猜这篇文章大部分的读者是这一级的CSS开发人员,我想我自己也是。不过这还不是最好的……

  第6级:哪个版本的CSS?是的,我知道啊。你有读过我的书关于……
  What version of CSS? Yes, I do. Did you read my book about…
  第6级的人致力于改良CSS,并且写了许多很棒的文章介绍它的新用法。其中有些人将W3C关于CSS的说明文件全部读完了,并且知道哪些功能在哪个版本的浏 览器才有支持。他们是CSS初学者的典范,并且运用他们的影响力使网络更加进步。其中有许多人组成了Web Standards Project,如果你在他们的网站上面发现任何错误,那一定是有理由的,向他们请教之后你必能获得满意的解答。

来源:https://www.tulaoshi.com/n/20160219/1609967.html

延伸阅读
中医与中药是我们充满智慧的祖先留给我们的果实,造福了后人。中医与中药在今日毫无褪色,仍被大家所认可。今天我们主要来聊聊中药。相信很多人对中药一点也不陌生,但是大家对中药的了解究竟有多少呢?你知道中药什么时候喝最好吗?你知不知道要怎么来挑选中药呢?如果您跟图老师小编一样不是很清楚的话,就来看看这篇文章的介绍吧,相信大家...
一个小细节也会阻碍你好孕(1) 许多职业女性在事业未成时,没有将做妈妈列入人生的计划当中。等到事业逐步稳定时,却发现怀孕越来越难。 个案1、脏毛巾引发了宫颈炎 说起来,程程一直怀不上孩子纯属她自己不注意。因为工作的缘故,程程常出差。在出差时,大大咧咧的她,在洗澡时爱用小宾馆里的毛巾,也不注意毛巾是否干净。不久,程程发现...
标签: Web开发
纵向书写特点: 每个CSS属性独立一行,一般不会出现换行或横向滚动条。 可以通过firebug等工具查找到模块,在DW中ctrl+g行定位,修改方便。 属性段落间有缩进,保证了代码的整洁,层次清楚,符合编程语言代码规范,修改更加直观。 存在的问题:代码冗余(如空格符、tab符、换行符);文件大小增加;容易出现纵向滚动条。 横向书写特点: ...
标签: Web开发
Cascading Style Sheets: The Definitive Guide, 2nd Edition is a thorough review of all aspects of CSS2.1 and a comprehensive guide to CSS implementation. The book includes new content on positioning, lists and generated content, table layout, user interface, paged media, and more. It explores in detail each individ...
标签: Web开发
less官方网址:http://lesscss.org 下面就来介绍下吧 less用变量 (variables),引用(mixins),表达式(operations),嵌套规则(nested rules)来扩展css开发   变量 (variables) 重复使用的值可以定义成变量的形式,方便更改哈 例子如下: #header { color: #4D926F;}h2 { color: #4D926F;} @brand_color: #4D926F;#header ...

经验教程

308

收藏

50
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部