鱼C论坛

 找回密码
 立即注册
查看: 1465|回复: 3

[奇技淫巧] 忆往昔CSS峥嵘岁月

[复制链接]
发表于 2018-12-5 18:11:14 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能^_^

您需要 登录 才可以下载或查看,没有账号?立即注册

x
本帖最后由 不二如是 于 2020-3-17 19:11 编辑

rBEhWVNGP5UIAAAAAAB_iCuo6_MAALicgN9CwMAAH-g699.jpg


《零基础入门学习Web》(H5&C3)HTML5渐渐进入尾声 ,近期开始对CSS3部分进行前期准备。

偶然看到几年前的一本神书《CSS禅意花园》,评价很高,很有年代感,目前不仔细找很难买到了(加价可以 )。
(膜拜网站:传送门

Snip20181205_38.png


好吧,在Web课程一开始,小甲鱼老师科普了一下简史,请大家按照兴趣自行穿越哈。
CSS简史HTML简史

感慨结束,我们进入正题:
那些年辉煌的CSS历史


html和css是那么密不可分,以至于你可能会觉得它们是一起出现的。

实际上,自1989年Tim Berners Lie发明互联网后的多年中,这个世界上都不存在一个名为css的事物,web的原始版本根本就没有提供一种装饰网页的方法。

PindropBoardHS_Marc_Andreesen_Cutout.png


在www的邮件列表中深埋着一封由Marc Andreessen写于1994年的不出名的邮件。
(Marc Andreessen也是后来知名的Mosaic浏览器和网景浏览器的合作开发者)

在那封邮件中,Andreessen指出由于没有办法通过html装饰一个网站,当他被问到视觉设计时,他唯一能告诉web开发者的一句话是:
”sorry you’re screwed
(对不起,你搞砸了)”


不过,在随后仅短短10年后,CSS就被一个现代的web社区全面采用,我们一起来看看,这一路发生了什么?




新的标记语言

关于web如何布局存在很多种理论上的观点。

然而,这并不是Berners Lie 的优先考虑事项,他在欧洲核子研究中心的雇主大多只对网络感兴趣,因此他们的主要精力也是集中在网络上。(联结更多的节点)

不过,社区中的开发者则提出了一些竞争性的网页布局理论,最显着的理论分别来自Pei Yaun Wei,Andreesen和HakonWium Lie。

Snip20181206_40.png


Pei-Yuan Wei在1991年创建图形浏览器 ViolaWWW ,他整合了他自己提出的样式语言到自己开发的浏览器中,还期望自己的样式语法最终能成为web关于样式的官方标准。

虽然这个目标并未达到,但是他提出的样式语法确实为其它的一些样式语法提供了一些灵感。

640.png


与此同时,Andreessen 在他开发的网景浏览器中进行了不同的尝试。

他并没有创建一种分离式的标记语言,而是采取拓展HTML标签的方法来包含非标准化的HTML标签已达到装饰网页的目的。

不幸的是,没过多久,网页就失去了所有的语义化并看起来像下面这样混乱:
  1. <MULTICOL COLS="31" GUTTER="25">
  2.   <P><FONT SIZE="14" COLOR="Greeb">www.ilovefishc.com</FONT></P>
  3. </MULTICOL>
复制代码


每个人,每个公司,都个成一派,按照自己的标准指定样式(群雄割据)。

开发者很快就意识到,这种尝试是没有前景的。

随机web社区产出了很多其它的替换方案,比如RRP—一种运用缩写非常简洁的样式表语言;

PSL96—一种支持函数和状态语句的语言。

hkon-wium-lie-css-creed-origins.jpg


最终被大家采纳的语言是由Hakon Wium 在 1994年 10月提出的样式语法。

它被称为样式层叠表,简称CSS




分久必合

CSS最终胜出的主要原因是因为它非常简单,这一点在和它同时代的竞争者比起来则更加明显。

早期的CSS语法如下:
  1. window.margin.left = 1cm
  2. font.family = newroma
  3. h1.font.size = 24pt 30%
复制代码


css是一种描述性的编程语言。

当我们写CSS时,我们并不会告诉浏览器具体该如何渲染网页。

相反,我们逐个写好描述HTML文档的规则,让浏览器来处理渲染。

考虑到网络主要是由业余程序员和雄心勃勃的爱好者构建,CSS遵循了一种可预测的,包容性的格式。

这样任何人都可以轻易的使用它,这意味着就算部分语法有误,CSS还是可以正常运行,这是一种特性而非一个bug。

CSS从某种程度上看又是独一无二的,就像它的全名样式层叠表中描述的那样,CSS支持样式级联

级联意味着样式可以遵循一个特殊的规则继承和覆盖之前定义过的其它样式,而且CSS还支持在同一个页面上使用多个样式表。

注意到上面最初CSS语法中的百分比没?

用户和开发者可能会采用不同的方法来定义样式,浏览器则是两者之间的中介,通过协商差异来呈现页面。

上面的百分比代表了样式的权重,权重越低越容易被覆盖。

在CSS提出的早期,这一点引起了大辩论,一些人认为开发者应该具备对样式完全的控制权限,其他人则认为用户应该具备一定的控制权限。

最终,为了提供更清晰的覆盖规则这个百分比被移除了,不过这也是现代CSS中支持权重Specificity这一概念的原因。

不久后,Hakon Wium 就发布了他的原始提案,他和团队制定了一个更为详细的标准并向新创建HTML的工作组W3C求助推广。

经过多年的努力,到1996年底,CSS语法变成了我们熟悉的样子:
游客,如果您要查看本帖隐藏内容请回复


CSS自此诞生了。

现在,伴随着缓慢而坚定的势头,CSS越来越高级,并逐步加入了一些新属性,浏览器也开始竞相实现新标准。

开发人员不断在自己的项目中运用新特性,CSS真的成为了事实上的标准。

就像很久之前它声称的那样。

最后,很快大家就会看到《零基础入门学习Web开发》(HTML5 & CSS3)中的CSS3部分,敬请期待





                               
登录/注册后可看大图


如果喜欢,别忘了评分


                               
登录/注册后可看大图


这位鱼油,如果喜欢本系列HTML帖子,请订阅 专辑&#9758;传送门)(不喜欢更要订阅
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2018-12-6 16:01:09 | 显示全部楼层
到哪儿都有卤蛋哥~
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-6-28 16:12:42 | 显示全部楼层
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2021-4-26 20:38:37 | 显示全部楼层
799
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-4-26 10:27

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表