当前位置: 首页 > news >正文

黑豹程序员-架构师学习路线图-百科:CSS-网页三剑客

文章目录

  • 1、为什么需要CSS
  • 2、发展历史
  • 3、什么是CSS
  • 4、什么是SASS、SCSS

1、为什么需要CSS

在这里插入图片描述

作为网页三剑客的第二,CSS为何需要它,非常简单HTML只能完成页面的展现,但其做出来的页面奇丑无比。
随着网络的普及,人们的要求更高,不仅要看信息,还希望页面更加优美。
这个任务HTML完成不了,于是就产生了CSS样式表来美化我们的页面。

2、发展历史

1990年,Tim Berners-Lee和Robert Cailliau共同发明了Web。1994年,Web真正走出实验室。

从HTML被发明开始,样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。随着HTML的成长,为了满足页面设计者的要求,HTML添加了很多显示功能。但是随着这些功能的增加,HTML变的越来越杂乱,而且HTML页面也越来越臃肿。于是CSS便诞生了。

1994年,HTML作者的挪威同事 哈坤·利(Hakon Wium Lie) 首先提出CSS。

而当时伯特·波斯(Bert Bos)正在设计一个名为Argo的浏览器,于是他们决定一起设计CSS。
其实当时在互联网界已经有过一些统一样式表语言的建议了,但CSS是第一个含有“层叠”丰富含义的样式表语言。

哈坤于1994年在芝加哥的一次会议上第一次提出了CSS的建议,1995年的www网络会议上CSS又一次被提出,博斯演示了Argo浏览器支持CSS的例子,哈肯也展示了支持CSS的Arena浏览器。

同年,W3C组织(World WideWeb Consortium)成立,CSS的创作成员全部成为了W3C的工作小组并且全力以赴负责研发CSS标准,层叠样式表的开发终于走上正轨。

有越来越多的成员参与其中,例如微软公司的托马斯·莱尔顿(Thomas Reaxdon),他的努力最终令Internet Explorer浏览器支持CSS标准。哈坤、波斯和其他一些人是这个项目的主要技术负责人。1996年底,CSS初稿已经完成,同年12月,层叠样式表的第一份正式标准(Cascading style Sheets Level 1)完成,成为w3c的推荐标准。

1997年初,W3C组织负责CSS的工作组开始讨论第一版中没有涉及到的问题。
其讨论结果组成了1998年5月出版的CSS规范第二版。

3、什么是CSS

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

CSS 1 :始于1966年。

CSS 2 :诞生于1998年,添加定位,Z-index,media 属性。

CSS 2.1:诞生于2004~2011年,目前使用最广泛的版本(IE支持)

CSS 3:1999年开始起草,把CSS模块化,独立升级各功能。

4、什么是SASS、SCSS

在这里插入图片描述
官网:https://sass-lang.com/

Sass(英文全称:Syntactically Awesome Stylesheets)是采用 Ruby 语言编写的一款 CSS 预处理语言,它诞生于2007年,是 CSS 预处理语言。最初它是为了配合 HAML(一种缩进式 HTML 预编译器)而设计的,因此有着和 HTML 一样的缩进式风格。

较新的语法叫做SCSS,是 SassyCSS 的简写,使用和 CSS 一样的块语法,即使用大括号将不同的规则分开,使用分号将具体的样式分开。采用.scss文件扩展名区。

SASS是CSS3的一个扩展,增加了规则嵌套、变量、混合、选择器继承等等。通过使用命令行的工具或WEB框架插件把它转换成标准的、格式良好的CSS代码。

SCSS即是SASS的3.0是CSS3语法的超集,也就是说所有有效的CSS3样式也同样适合于SASS。

总结一句,说白了让静态的CSS变成动态可编程的CSS。

http://www.lryc.cn/news/182027.html

相关文章:

  • NUWA论文阅读
  • 4.Tensors For Beginners-Vector Definition
  • vertx学习总结5
  • Go,从命名开始!Go的关键字和标识符全列表手册和代码示例!
  • 【网络】网络扫盲篇 ——用简单语言和图解带你入门网络
  • 【项目开发 | C语言项目 | C语言薪资管理系统】
  • Android---GC回收机制与分代回收策略
  • 前缀、中缀、后缀表达式相互转换工具
  • Vue之ElementUI之动态树+数据表格+分页(项目功能)
  • 【CAD二次开发】给CAD添加TRUSTEDPATHS避免dll插件信任弹窗
  • 编译和链接
  • 常识判断 --- 科技常识
  • 修改npm全局安装的插件(下载目录指向)
  • <C++> 异常
  • 聊聊HttpClientBuilder
  • MacOS - Sonoma更新了啥
  • C++17中头文件filesystem的使用
  • 「专题速递」数字人直播带货、传统行业数字化升级、远程协作中的低延时视频、地产物业中的通讯终端...
  • PE格式之PE头部
  • SLAM从入门到精通(用python实现机器人运动控制)
  • 接口和抽象类有什么区别?
  • 基于springboot+vue的人事系统
  • 记住这份软件测试八股文还怕不能拿offer?你值得拥有
  • 2023年,在CSDN拥有10000粉丝有多难?
  • C++ -- 学习系列 关联式容器 set 与 map
  • Day 04 python学习笔记
  • Moonbeam Ignite强势回归
  • 【改造后序遍历算法】95. 不同的二叉搜索树 II
  • 栈的基本操作(数据结构)
  • D. Jellyfish and Mex Codeforces Round 901 (Div. 2)