CSS3需要重点学习什么?

2023-05-27 0 662

我也来试著着说说她们是怎么自学CSS的。

不可否认,Web的形成主要就早由HTML、CSS和JavaScript四个部份共同组成:

CSS3需要重点学习什么?

假如有中文网站或页面声称遵从页面国际标准,一般来说表示她们的页面合乎HTML(或HTML5,或XHTML)、CSS和JavaScript等国际标准。相关联的国际标准也分三方面:形式化国际标准词汇主要就主要包括XHTML和XML,整体表现国际标准词汇主要就主要包括CSS,犯罪行为国际标准主要就主要包括第一类数学模型(如W3C DOM)、ECMAScript等。而我们要讲的CSS就是Web国际标准中的整体表现国际标准词汇。

假如考量Web的可出访性,那么当代Web的构筑在旧有的HTML、CSS、JavaScript基础上还应该增加WAI-ARIA部份Web accessibility tree):

CSS3需要重点学习什么?
换句话说,CSS在Web中是必不可少的一部份!

CSS产业发展历史

维基是这样叙述的

1994年,拜占庭特·维姆·莱明确提出了CSS的起初提议。赖特·拜占庭彼时正在结构设计一个叫作Argo的应用程序,她们下定决心一同密切合作结构设计CSS。彼时早已有过许多JSP词汇的提议了,但CSS是第二个所含“竹节”的点子的。在CSS中,两个文档的式样能从其它的JSP中承继留下来。听众在有些地方性能使用他她们更喜欢的式样,在其它地方性则承继,或“竹节”译者的式样。这种竹节的形式使译者和听众都能灵巧地重新加入她们的结构设计,混和自已的嗜好。拜占庭特·莱于1994年在波士顿的一场全会上第一场展现了CSS的提议,1995年他与拜占庭一同再度展现那个提议。彼时W3C才刚建立,W3C对CSS的产业发展颇感兴趣,它有鉴于此组织机构了一场研讨会。拜占庭特、拜占庭和其它许多人(比如说谷歌理查德·里尔姆)是那个工程项目的主要就技术相关人士。1996月底,CSS早已顺利完成。
CSS3需要重点学习什么?
Håkon Wium Lie, chief technical officer of the Opera Software company and co-creator of the CSS web standards

自从CSS的诞生到现在,CSS的版本有多个版本:

CSS3需要重点学习什么?

而且至今为止,CSS2.1中规范还是CSS使用的重要指南之一:

CSS3需要重点学习什么?

现在升级到2.2版本:

Cascading Style Sheets Level 2 Revision 2 (CSS 2.2) Specificationwww.w3.org/TR/CSS22/

随着CSS的很多新特性出现之后,社区开发者把这些CSS新特性称为CSS3,事实上在W3C规范中并没有CSS3这样的版本。因为自CSS 2.2之后,CSS将按功能模块来划分,然后按 Level 版本来区别:

CSS3需要重点学习什么?
CSS current work & how to participatewww.w3.org/Style/CSS/current-work.en.html

不过现在社区也有许多CSS4相关的提法:

CSS4 Why Are We Talking About CSS4?

Github有关于这方面的讨论也很激烈:

CSS规范的制定过程

用W3C上的一张图来简要的向大家展现一下两个CSS属性规范诞生的历程:

CSS3需要重点学习什么?

CSS的每项规范大致都会经历下面这几个过程:

编辑草案(ED):这是一项规范的初始阶段,可能非常粗糙。对那个阶段没有什么要求,也不保证它会被工作组批准。但它也是各个修订版本的必经阶段,每次变更都是先从两个 ED 中产 生的,然后才会发布出来。首个公开工作草案(FPWD):一项规范的首个公开发布版本,它应该准备就绪,以接受工作组的公开反馈。工作草案(WD):在第二个 WD 之后,还会有更多的 WD 出来。 这些 WD 会吸收来自工作组和更广阔的社区的反馈,一版接着一版小幅改进。浏览器的早期实现一般来说是从那个阶段开始的,厂商基本不太可能对更早阶段的草案提供实验性的支持。候选推荐规范(CR):这能认为是两个相对稳定的版本。此时比较适合实现和测试。一项规范只有具备一套完整的测试套件和两个独立的实现之后,才有可能继续推进到下一阶段。提名推荐规范(PR):这是 W3C 会员公司对这项规范表达反对意见的最后机会。实际上她们很少在那个阶段明确提出异议,因此每个 PR 推进到下一阶段(也是最后两个阶段)只是时间问题。正式推荐规范(REC):一项 W3C 技术规范的最终阶段。

如何自学CSS

对于CSS的自学,从初学者到该领域的许多专家,应该会经历这几个过程。先来看初学者。

初学者如何自学CSS

对于初次接触或自学CSS的同学来说,最好的办法是先看书,比如说能阅读:

假如你能静下心来阅读完这两本书,那么你对CSS会有两个初步和全面的了解。当然只读阅读是不够的,假如要加强这方面的知识和理解还是需要动手写代码。写CSS有两个最好的优势,那就是你写的效果立马能在应用程序中看到。估计这也是为什么有很多同学喜欢CSS的原因之一,也被认为CSS很简单的原因之一。

我提议你多阅读几遍。

有了一定的基础之后,能考量购买另外几本书:

这本书将会带着你用实例向你阐述许多CSS新特性。

图解CSS,更新的版本内容能点击这里阅读。

假如你希望了解CSS新特性中的小技巧,能接着购买:

这本书中能学到许多CSS绘图的技巧,实现许多视觉效果。 这样一来,你能使用纯CSS实现类似下图这样的效果:

CSS3需要重点学习什么?

上图代码能点击下面卡片阅读:

另外近两年来,CSS领域较好的书是

老师的:

图灵出版本社也刚上架了一本CSS新书,对于初学者来说还不错:

CSS3需要重点学习什么?
广告
京东
¥271.00
去购买
我想你要是真阅读完这几本书,并且实战过,我想你在CSS方面早已有较好的经验了!

中级者如何自学CSS

对于对CSS有一定认识的同学,希望进一步加强CSS的自学,最好的形式是阅

不过阅读规范是件痛苦的事情,换句话说,阅读规范是有一定技巧的。假如你对这方面不太了解,我提议你阅读:

https://kinboyw.github.io/2018/10/29/%E5%A6%82%E4%BD%95%E9%98%85%E8%AF%BBW3C%E8%A7%84%E8%8C%83/kinboyw.github.io/2018/10/29/%E5%A6%82%E4%BD%95%E9%98%85%E8%AF%BBW3C%E8%A7%84%E8%8C%83/
https://chenhuijing.com/blog/learning-css-by-reading-specifications/#%F0%9F%9A%B2chenhuijing.com/blog/learning-css-by-reading-specifications/#%F0%9F%9A%B2

同时那个时候你应该多花时间去阅读CSS中的几个重要概念,比如说:

CSS选择器CSS 竹节和承继CSS尺寸的设置 视觉格式化数学模型 CSS定位和竹节控制CSS盒数学模型 CSS颜色布局 排版 动画 媒体查询

只掌握CSS属性(或特性的使用)还是不够的,还需要掌握许多CSS方法论。这些CSS方法论能更好的帮助你书写CSS、维护CSS等。在社区中有关于这方面的讨论也比较多,比如说《写CSS姿势》一文中提到的许多方法论。假如你能领会,那么在编写,维护和管理CSS方面肯定会有两个质的进步。

CSS3需要重点学习什么?

现在在社区这方面最为流行的是Atomic DesignTailwind CSS :

Tailwind CSS – A utility-first CSS framework for rapidly building custom designstailwindcss.com/CSS3需要重点学习什么?

Tailwind CSS也是functional CSS之一。Functional CSS方面的讨论在社区中也越来越多:

https://www.browserlondon.com/blog/2019/06/10/functional-css-perils/#:~:text=Functional%20CSS%20(sometimes%20referred%20to,utility%20classes%20to%20construct%20components.&text=Instead%2C%20functional%20CSS%20argues%20that,%2C%20since%2C%20as%20the%20Vue.www.browserlondon.com/blog/2019/06/10/functional-css-perils/#:~:text=Functional%20CSS%20(sometimes%20referred%20to,utility%20classes%20to%20construct%20components.&text=Instead%2C%20functional%20CSS%20argues%20that,%2C%20since%2C%20as%20the%20Vue.

方面的知识,这里推荐几个有关于CSS方面较好的中文网站:

假如早已是中级者了,希望再往下走一步。那最好的方法就是系统性的阅读规范,并且根据规范两个功能模块两个功能模块的去整理相关体系。我最近也在重读W3C功能模块相关的规范,在阅读规范的时候再度让我她们发现,原来她们对很多基础和底层的知识理解的并不是非常的清楚,所涉猎的知识还是有欠缺。另外在重读规范的时候,发现以前在工作中碰到的问题,很多时候都能从中找到答案。

这里我简单的聊一下,我现在是怎么阅读W3C规范的。

我会针对其中功能模块做许多整理,经如绘制脑图:

CSS3需要重点学习什么?
CSS3需要重点学习什么?

然后根据脑图,针对每个部份知识点重新梳理,就拿Flexbox模块来说吧,以前可能只会了解Flexbox布局怎么使用,但随着知识面的扩展,可能会考量CSS中的哪些东西对Flexbox有着直接的影响,比如说书写模式、阅读模式都对它有直接影响:

CSS3需要重点学习什么?
CSS3需要重点学习什么?
CSS3需要重点学习什么?
CSS3需要重点学习什么?

这里只演示了书写模式、阅读模式对Flexbox模块的影响。是不是看上去很复杂,但假如能静下心来,就能慢慢的梳理的更清楚。

另外

然后跟她们对比,假如她们从未接触过,那就会找时间去自学和梳理。

高级者如何自学CSS

因为我她们还未达到那个级别,我也正在不断的努力,争取能早一点能达到这方面的高级者或者该领域的专家。

最后希望上面的回答对于想学或希望提高CSS的同学有所帮助。最后我用两句话来结束:

CSS is awesome!

CSS is simple, but not easy!

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务