黑豹程序员-架构师学习路线图-百科: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。
相关文章:
黑豹程序员-架构师学习路线图-百科:CSS-网页三剑客
文章目录 1、为什么需要CSS2、发展历史3、什么是CSS4、什么是SASS、SCSS 1、为什么需要CSS 作为网页三剑客的第二,CSS为何需要它,非常简单HTML只能完成页面的展现,但其做出来的页面奇丑无比。 随着网络的普及,人们的要求更高&…...
NUWA论文阅读
论文链接:NUWA: Visual Synthesis Pre-training for Neural visUal World creAtion 文章目录 摘要引言相关工作视觉自回归模型视觉稀疏自注意 方法3D数据表征3D Nearby Self-Attention3D编码器-解码器训练目标 实验实现细节与SOTA比较T2I微调T2V微调V2V微调Sketch-t…...
4.Tensors For Beginners-Vector Definition
在上一节,已经了解了前向和后向转换。 什么是向量? 定义1:向量是一个数字列表 这很简洁,也通俗易懂。 现有两个向量: 如果要把这两个向量给加起来,只需把对应位置的元素(组件)给加起来。 而要缩放向量&…...
vertx学习总结5
这章我们讲回调,英文名:Beyond callbacks 一、章节覆盖: 回调函数及其限制,如网关/边缘服务示例所示 未来和承诺——链接异步操作的简单模型 响应式扩展——一个更强大的模型,特别适合组合异步事件流 Kotlin协程——…...
Go,从命名开始!Go的关键字和标识符全列表手册和代码示例!
目录 一、Go的关键字列表和分类介绍关键字在Go中的定位语言的基石简洁与高效可扩展性和灵活性 关键字分类声明各种代码元素组合类型的字面表示基本流程控制语法协程和延迟函数调用 二、Go的关键字全代码示例关键字全代码示例 三、Go的标识符定义基础定义特殊规定关键字与标识符…...
【网络】网络扫盲篇 ——用简单语言和图解带你入门网络
网络的一些名词和基础知识讲解 前言正式开始一些基础知识发展背景运营商和生产商 协议协议的分层TCP/IP五层(或四层)模型(可以不看,对新手来说太痛苦了,我这里只是为了让屏幕前的你过一遍就好,里面很多概念新手是不太懂的…...
【项目开发 | C语言项目 | C语言薪资管理系统】
本项目是一个简单的薪资管理系统,旨在为用户提供方便的员工薪资管理功能,如添加、查询、修改、删除员工薪资信息等。系统通过命令行交互界面与用户进行交互,并使用 txt 文件存储员工数据。 一,开发环境需求 操作系统:w…...
Android---GC回收机制与分代回收策略
目录 GC 回收机制 垃圾回收(Garbage Collection, GC) 垃圾回收算法 JVM 分代回收策略 1. 新生代 2. 老年代 GC Log 分析 引用 GC 回收机制 垃圾回收(Garbage Collection, GC) 垃圾就是内存中已经没有用的对象,JVM 中的垃圾回收器(Garbage Collector)会自…...
前缀、中缀、后缀表达式相互转换工具
目录 1. 界面一览 2. 使用说明 3. 实例演示 3.1 输入中缀 3.2 输入前缀 3.3 输入后缀 3.4 选择错误的类型 4. 代码 5. 资源地址 关于什么是前缀、中缀、后缀表达式,相信你不知道这个东西,那你也不会点进来这篇博客,当然,…...
Vue之ElementUI之动态树+数据表格+分页(项目功能)
目录 前言 一、实现动态树形菜单 1. 配置相应路径 2. 创建组件 3. 配置组件与路由的关系 index.js 4. 编写动态树形菜单 5. 页面效果演示 二、实现数据表格绑定及分页功能 1. 配置相应路径 2. 编写数据表格显示及分页功能代码 BookList.vue 3. 演示效果 总结 前言…...
【CAD二次开发】给CAD添加TRUSTEDPATHS避免dll插件信任弹窗
找到配置文件目录,遍历下面的每个配置文件; 找到 Variables 下的TRUSTEDPATHS项目;在后面添加新的目录即可,多个目录使用分号分隔; public static void AddPath(string trusedPath){// 指定注册表键的路径...
编译和链接
编译和链接 一:???二:翻译环境1:编译1:预处理2:编译 2:链接 三:运行环境: 本文章所使用的图片均来在yyds鹏哥一:?…...
常识判断 --- 科技常识
目录 力与热 光和声 航空成就 垃圾分类 百科知识 血型 二十四节气歌 春雨惊春清谷天 夏满忙夏暑相连 秋处露秋寒霜降 冬雪雪冬小大寒 力与热 光和声 航空成就 垃圾分类 百科知识 血型...
修改npm全局安装的插件(下载目录指向)
我们先打开终端 然后执行 npm config get prefix查看npm 的下载地址 一般都会在C盘 但是 我们都知道 C盘下东西多了是很不好的 所以 我们可以执行 npm config set prefix “E:\npmfile”将 npm 的下载地址 改变成 E盘下的 npmfile目录 这样 以后 默认全局安装的插件就会都到…...
<C++> 异常
C语言传统的处理错误的方式 传统的错误处理机制: 终止程序,如assert,缺陷:用户难以接受。如发生内存错误,除0错误时就会终止程序。返回错误码,缺陷:需要程序员自己去查找对应的错误。如系统的…...
聊聊HttpClientBuilder
序 本文主要研究一下HttpClientBuilder HttpClientBuilder httpclient-4.5.10-sources.jar!/org/apache/http/impl/client/HttpClientBuilder.java public class HttpClientBuilder {public static HttpClientBuilder create() {return new HttpClientBuilder();}protected…...
MacOS - Sonoma更新了啥
1 系统介绍 苹果公司于2023年9月26日发布了macOS Sonoma 14.0正式版。名称由来不知道,可能是地名:Sonoma是一个地名,指加利福尼亚州北部索诺玛县(Sonoma County)。 2 系统重要更新 2.1 将小组件添加到桌面 速览提醒事项和临近日程等。按住Control键点…...
C++17中头文件filesystem的使用
C17引入了std::filesystem库(文件系统库, filesystem library),相关类及函数的声明在头文件filesystem中,命名空间为std::filesystem。 1.path类:文件路径相关操作,如指定的路径是否存在等,其介绍参见:http…...
「专题速递」数字人直播带货、传统行业数字化升级、远程协作中的低延时视频、地产物业中的通讯终端...
音视频技术作为企业数字化转型的核心要素之一,已在各行各业展现出广泛的应用和卓越的价值。实时通信、社交互动、高清视频等技术不仅令传统行业焕发新生,还为其在生产、管理、服务提供与维护等各个领域带来了巨大的助力,实现了生产效率和服务…...
PE格式之PE头部
1. PE头部总体组成 2. DOS MZ头 3. PE头 PE头由3部分组成: 下面分别: OptionalHeader比较大: 然后是节表, 节表有多个: PE文件头部就结束了, 最后就是节区了, 来看几段代码: ; main.asm .586 .model flat, stdcall option casemap:noneinclude windows.inc include ke…...
MySQL登录报错1045?手把手教你找回丢失的root用户(附完整修复流程)
MySQL登录报错1045:从root用户丢失到完整恢复的实战指南 当你信心满满地输入mysql -u root -p准备开始一天的工作,却迎面撞上冰冷的"ERROR 1045 (28000): Access denied for user rootlocalhost"时,这种挫败感每个DBA都深有体会。更…...
鸿蒙应用开发全景解析与高阶面试指南
第一章 鸿蒙生态技术演进与开发环境鸿蒙操作系统(HarmonyOS)的分布式架构实现了跨设备算力调度,其核心设计思想可抽象为: $$ \text{Device}i \xrightarrow{\text{IDMS}} \text{Pool}{\text{compute}} \xrightarrow{\text{DistSche…...
从数据流视角看训练:你的GPU/TPU是如何‘吃’数据的?Epoch、Batch与迭代的硬件协同
从数据流视角看训练:你的GPU/TPU是如何‘吃’数据的?Epoch、Batch与迭代的硬件协同 当你在深夜盯着屏幕上缓慢跳动的训练进度条时,是否好奇过那些被吞进GPU的数据究竟经历了怎样的旅程?本文将带你从硬件执行层的独特视角ÿ…...
CTFHub | 解密MySQL、Redis、MongoDB流量中的隐藏Flag
1. 数据库流量分析入门:为什么需要Wireshark? 当你参加CTF比赛时,经常会遇到需要从数据库流量中寻找Flag的题目。这类题目通常会给你一个抓包文件(pcap格式),里面记录了MySQL、Redis或MongoDB等数据库的网络…...
ABAP - MEMORY ID 的跨程序数据共享实践
1. ABAP内存ID:跨程序数据共享的秘密武器 在SAP开发中,经常会遇到这样的场景:程序A需要某些数据,但获取这些数据的逻辑写在程序B里。传统做法可能是通过接口、数据库表或者文件来中转数据,但这些方法要么太麻烦&#x…...
深入剖析YOLOv8核心模块:从架构设计到实战应用全解析
1. YOLOv8架构设计揭秘 YOLOv8作为目标检测领域的标杆模型,其架构设计处处体现着工程师的巧思。我第一次拆解它的代码时,最惊艳的是它的模块化设计——就像搭积木一样,每个组件都能灵活替换。核心的Backbone部分采用CSPDarknet53结构…...
泛微Ecology流程数据查询避坑指南:workflow_currentoperator表里isremark字段到底怎么用?
泛微Ecology流程数据查询实战:解密workflow_currentoperator表关键字段 在泛微Ecology系统的二次开发过程中,流程数据的精准查询往往是开发者面临的第一道门槛。特别是当需要对接第三方系统或构建定制化报表时,对workflow_currentoperator表中…...
SDMatte高可用集群部署:基于Kubernetes的弹性伸缩方案
SDMatte高可用集群部署:基于Kubernetes的弹性伸缩方案 1. 为什么需要高可用部署方案 电商大促期间,某美妆品牌突然发现他们的AI抠图服务崩溃了——每秒上千张的商品图等待处理,但单机部署的服务早已不堪重负。这种场景在企业级AI应用部署中…...
Qwen3-ASR-0.6B WebUI实战:中文方言自动识别与结果导出操作
Qwen3-ASR-0.6B WebUI实战:中文方言自动识别与结果导出操作 1. 快速了解Qwen3-ASR-0.6B语音识别模型 Qwen3-ASR-0.6B是一个轻量级但性能强大的语音识别模型,专门为实际应用场景设计。这个模型只有6亿参数,但识别效果却相当出色,…...
FRCRN模型结构解析:频域卷积+循环网络如何协同提升信噪比
FRCRN模型结构解析:频域卷积循环网络如何协同提升信噪比 1. 引言:语音降噪的挑战与突破 语音降噪技术一直面临着"既要又要"的难题:既要彻底消除背景噪声,又要完整保留人声细节。传统的降噪方法往往在这两者之间难以平…...
