黑豹程序员-架构师学习路线图-百科: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.mzph.cn/news/95511.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

cmip6数据处理之降尺度

专题一 CMIP6中的模式比较计划 1.1 GCM介绍全球气候模型(Global Climate Model, GCM),也被称为全球环流模型或全球大气模型,是一种用于模拟地球的气候系统的数值模型。这种模型使用一系列的数学公式来描述气候系统的主要组成部分…

arm 汇编基础指令

实现1-100求和 .text .globl _start_start:mov r0, #1 i&#xff0c;i1mov r1, #100 条件变量i<100mov r2, #0 sumLoop: 循环cmp r0,r1 比较r0和r1的大小bhi stop 当r0>r1时&#xff0c;跳到stop标签a…

STM32G070RBT6-MCU温度测量(ADC)

1、借助STM32CubeMX生成系统及外设相关初始化代码。 在以上配置后就可以生成相关初始化代码了。 /* ADC1 init function */ void MX_ADC1_Init(void) {/* USER CODE BEGIN ADC1_Init 0 *//* USER CODE END ADC1_Init 0 */ADC_ChannelConfTypeDef sConfig {0};/* USER COD…

十天学完基础数据结构-第八天(哈希表(Hash Table))

哈希表的基本概念 哈希表是一种数据结构&#xff0c;用于存储键值对。它的核心思想是将键通过哈希函数转化为索引&#xff0c;然后将值存储在该索引位置的数据结构中。 哈希函数的作用 哈希函数是哈希表的关键部分。它将输入&#xff08;键&#xff09;映射到哈希表的索引位…

全志ARM926 Melis2.0系统的开发指引⑧

全志ARM926 Melis2.0系统的开发指引⑧ 编写目的12.5. 应用程序编写12.5.1. 简单应用编写12.5.1.1. 注册应用12.5.1.2. 创建管理窗口12.5.1.3. 实现管理窗口消息处理回调函数12.5.1.4. 创建图层12.5.1.5. 创建 framewin12.5.1.6. 实现 framewin 消息处理回调函数 -. 全志相关工具…

R语言教程课后习题答案(持续更新中~~)

R语言教程网址如下 https://www.math.pku.edu.cn/teachers/lidf/docs/Rbook/html/_Rbook/index.html 目录 source()函数可以运行保存在一个文本文件中的源程序 R向量下标和子集 数值型向量及其运算 日期功能 R因子类型 source()函数可以运行保存在一个文本文件中的源程序…

H5移动端购物商城系统源码 小型商城全新简洁风格全新UI 支持易支付接口

一款比较简单的 H5 移动端购物商城系统源码&#xff0c;比较适合单品商城、小型商城使用。带有易支付接口。 源码下载&#xff1a;https://download.csdn.net/download/m0_66047725/88391704 源码下载2&#xff1a;评论留言或私信留言

保险业SAP转型:奠定坚实的基础

保险业面临着许多新的挑战&#xff1a;从新的市场参与者到人工智能和物联网。如何在这种快节奏的现实中满足客户的需求&#xff0c;降低成本&#xff0c;加速增长&#xff1f;首先&#xff0c;让我们考虑一下数字化转型成功是什么样子的&#xff0c;以及如何实现它。在这篇文章…

克服网络安全压力:如何掌控无限的云数据

管理云中的数字风险比以往任何时候都更加重要。数字化转型引发的云数据呈指数级增长&#xff0c;为安全分析师创造了一个更大的威胁环境。随着威胁行为者继续危害组织最敏感的数据&#xff0c;这一挑战将会加剧。 预计未来五年全球网络犯罪成本将激增&#xff0c;从 2022 年的…

强化学习实践(二)Gym安装及环境搭建(代码可运行)

1.准备工作 优先选用conda&#xff0c;conda不仅可以安装python&#xff0c;也是环境管理的工具&#xff0c;我们可以通过conda创建python环境&#xff0c;每个环境之间是相互独立&#xff0c;这样不同的环境可以使用不同版本的python&#xff0c;不同版本的开发包&#xff0c;…

mysql技术文档--阿里巴巴java准则《Mysql数据库建表规约》--结合阿丹理解尝试解读--国庆开卷

阿丹&#xff1a; 国庆快乐呀大家&#xff01; 在项目开始前一个好的设计、一个健康的表关系&#xff0c;不仅会让开发变的有趣舒服&#xff0c;也会在后期的维护和升级迭代中让系统不断的成长。那么今天就认识和解读一下阿里的准则&#xff01;&#xff01; 建表规约 表达是…

unity脚本_Vector3 c#

接下来学习 相对世界坐标 首先我们给场景物体一个空物体 修改新建空物体名字为GameObjectFather 修改GameObjectFather坐标 修改GameObject2坐标 然后将GameObjectFahter设置成GameObject2的父物体 我们观察到子物体的坐标改变了但是 运行显示的相对世界坐标this.transform.po…

基于蝴蝶优化的BP神经网络(分类应用) - 附代码

基于蝴蝶优化的BP神经网络&#xff08;分类应用&#xff09; - 附代码 文章目录 基于蝴蝶优化的BP神经网络&#xff08;分类应用&#xff09; - 附代码1.鸢尾花iris数据介绍2.数据集整理3.蝴蝶优化BP神经网络3.1 BP神经网络参数设置3.2 蝴蝶算法应用 4.测试结果&#xff1a;5.M…

Apollo Planning2.0决策规划算法代码详细解析 (2): vscode gdb单步调试环境搭建

前言: apollo planning2.0 在新版本中在降低学习和二次开发成本上进行了一些重要的优化,重要的优化有接口优化、task插件化、配置参数改造等。 GNU symbolic debugger,简称「GDB 调试器」,是 Linux 平台下最常用的一款程序调试器。GDB 编译器通常以 gdb 命令的形式在终端…

MySQL:数据库的物理备份和恢复-冷备份(3)

介绍 物理备份&#xff1a; 直接复制数据文件进行的备份 优点&#xff1a;不需要其他的工具&#xff0c;直接复制就好&#xff0c;恢复直接复制备份文件即可 缺点&#xff1a;与存储引擎有关&#xff0c;跨平台能力较弱 逻辑备份&#xff1a; 从数据库中导出数据另存而进行的备…

C++树详解

树 树的定义 树&#xff08;Tree&#xff09;是n&#xff08;n≥0&#xff09;个结点的有限集。n0时称为空树。在任意一颗非空树中&#xff1a;①有且仅有一个特定的称为根&#xff08;Root&#xff09;的结点&#xff1b;②当n>1时&#xff0c;其余结点可分为m&#xff08…

【C语言经典100例题-70】求一个字符串的长度(指针)

代码 使用指针来遍历字符串&#xff0c;直到遇到字符串结尾的空字符\0为止&#xff0c;统计字符数量即为字符串长度。 #include<stdio.h> #define n 20 int getlength(char *a) {int len 0;while(*a!\0){len;a;}return len; } int main() {char *arr[n] { 0 };int l…

将3D MAX设计模型导入NX1988

将3D MAX设计模型导入NX1988 概述导入流程导出喜欢的模型对模型进行修改模型贴图 概述 一般家装设计都不会用NX之类的产品设计软件&#xff0c;也没有通用的文件格式可以互相转换&#xff0c;本文的目的是将从网上下载的一些设计较好的3D MAX模型导入到NX软件中借用&#xff0…

导出视频里的字幕

导出视频里的字幕 如何利用剪映快速提取并导出视频里的字幕 https://jingyan.baidu.com/article/c35dbcb0881b6fc817fcbcd2.html 如何快速提取视频中的字幕&#xff1f;给大家介绍一种简单高效又免费的提取方法。需要利用到“剪映”&#xff0c;以下是具体的操作步骤和指引&a…

【机器学习】训练集/验证集/测试集释疑

文章目录 序言1. 训练集、验证集、测试集是什么2. 为什么需要验证集3. 验证集是必须的吗4. 验证集和测试集上的表现会不同吗5. 如何从Train/Test Set划分Validation Set6. 训练集、验证集和测试集的比例怎么设置7. 模型表现不好时测试集可以反复使用来调整模型吗8. 训练集、验证…