CSS复习基础部分（二）引入、颜色、背景、注释

最新推荐文章于 2025-05-15 12:36:12 发布
原创 最新推荐文章于 2025-05-15 12:36:12 发布 · 119 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#css #html

本文介绍了三种使用方法，包括直接输入颜色、RGB/RGBA和HSL/HSLA模式，以及如何应用在背景设置上。深入理解颜色选择和布局技巧，提升前端设计水平。

一、使用
三种使用方法
二、注释
*开头
*/结尾
三、颜色

  1. 直接输入颜色
  2. rgb与rgba模式
  3. hsl与hsla模式

四、背景
backgroud-*

在这里插入图片描述

css零到一基础教程009：CSS HSL 颜色
kerryqpw的博客
03-18 996
HSL 值 在 CSS 中，可以使用色相、饱和度和明度（HSL）来指定颜色，格式如下： hsla(hue, saturation, lightness) 色相（hue）是色轮上从 0 到 360 的度数。0 是红色，120 是绿色，240 是蓝色。 饱和度（saturation）是一个百分比值，0％ 表示灰色阴影，而 100％ 是全色。 亮度（lightness）也是百分比，0％ 是黑色，50％ 是既不明也不暗，100％是白色。 请通过混合以下 HSL 值来进行实验： 实例 &lt..
CSS3中的HSLA用途及编程实例
2301_79325339的博客
10-17 486
以上提供的代码示例展示了如何在CSS中使用HSLA值来设置背景颜色和文本颜色，你可以根据需要调整HSLA的参数值来实现自己想要的效果。HSLA（Hue, Saturation, Lightness, Alpha）是CSS3中的一种颜色表示方式，它基于色相（Hue）、饱和度（Saturation）、亮度（Lightness）以及透明度（Alpha）四个参数来定义颜色。HSLA表示方式由四个值组成，分别是色相（0-360度）、饱和度（0%-100%）、亮度（0%-100%）和透明度（0-1之间的小数）。
CSS 的 hsl() 和 hsla() 函数（设置颜色的方式之一）
单枪匹码
11-07 5688
一：CSS中的 hsl()函数： 1、定义与用法：hsl() 函数使用色相、饱和度、亮度来定义颜色。 HSL 即：色相（Hue）、饱和度（Saturation）、亮度（Lightness）。 色相（H）是色彩的基本属性，就是平常所说的颜色名称，如红色、黄色等。 饱和度（S）是指色彩的纯度，越高色彩越纯，低则逐渐变灰，取0 ~ 100%的数值。 亮度（L），取0 ~ 100%，增加亮度，颜色会向白...
CSS3的颜色函数： hsl() 和 hsla() 函数
c6088的专栏
02-27 916
假如你的网站LOGO是橙色的，它对应的HSL颜色值为：hsl(30,90%,29%)，互补色就是色调值增加180度，得到的HSL颜色：hsl(210,90%,29%)HSLA 即：色相、饱和度、亮度、透明度（英语：Hue, Saturation, Lightness, Alpha ）。hue-色相 定义色相（0到360）-0（或360）为红色，120为绿色，240为蓝色。饱和度（S）是指色彩的纯度，越高色彩越纯，低则逐渐变灰，取 0-100% 的数值。透明度（A） 取值 0~1 之间， 代表透明度。
CSS第二章：3.颜色单位（HSL值、HSLA值）
励志成为会前后端、运维、云服务、嵌入式开发、AI和自动化技术的创业小老板！
04-27 1993
总览1.HSL值H - 色相，S - 饱和度，L - 亮度2.HSLA值A - 透明度一、色相 - H1.取值范围：0~360二、饱和度 - S1.取值范围：0~100%、亮度 - L1.取值范围：0~100% 四、HSL值 · 实操 1.HTML代码： 2.CSS代码： 3.实际显示 五、HSLA 1.无非就是加了一个参数负责调节透明度，参数取值范围为0~1 2.参考 RGBA 透明度调节：RGBA透明度调节教程 ...
CSS——CSS基础知识
流楚丶格念的博客
06-26 8368
文章目录CSS的发展历程CSS 网页的美容师CSS初识引入CSS样式表（书写位置）内部样式表行内式（内联样式）外部样式表（外链式）三种样式表总结（位置）CSS样式规则外链案例内链案例 CSS的发展历程 从HTML被发明开始，样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。 随着HTML的成长，为了满足页面设计者的要求，HTML添加了很多显示功能。但是随着这些功能的增加，HTML变的越来越杂乱，而且HTML页面也越来越臃肿。于是CSS便诞生
HTML与CSS复习笔记：基础标签与样式应用
例如，`bgcolor="#ffffff"` 可设置页面背景颜色，`background="image.jpg"` 则引入图像作为背景，`text` 属性用来设定正文文字的颜色。然而，随着Web标准的发展，特别是CSS的普及，这些内联表现性属性已被视为过时...
复习自测-CSS基础及选择器(1).doc
01-09
【CSS基础及选择器知识点详解】 CSS（Cascading Style Sheets）是一种用于描述HTML或XML（包括各种XML方言，如SVG、XHTML等）文档样式的样式表语言。CSS允许我们将样式信息与结构内容分离，使得页面设计更加灵活且...
Css复习题.docx
07-14
总的来说，CSS是Web开发中不可或缺的一部分，它允许开发者精细控制网页的视觉表现，实现跨浏览器的兼容性，并通过良好的语义化结构提升网页的可访问性和可维护性。了解和熟练掌握CSS的语法、优先级、浏览器兼容性...
CSS与Javascript基础复习指南
"CSS和Javascript简单复习资料" 在前端开发中，CSS（层叠样式表）和JavaScript是非常重要的技术，它们分别负责网页的样式表现和交互功能。以下是对这两个主题的详细解释： ### CSS (层叠样式表) CSS用于定义HTML或...
CSS中hsla的用法
暗影刀客的博客
12-24 6732
记下来，周末再写
CSS 中的 HSL 和 HSLA 与 RGB 和 RGBA
分享身边生活经验blog
09-29 1179
如果您了解 CSS 的工作原理，您可能还知道命名颜色、十六进制颜色和 RGB 颜色。它们三个都代表颜色及其在 CSS 中的用法。命名颜色是预定义的颜色值，例如 black, white, red, green等。命名颜色的问题在于它们是有限的，没有办法对其进行调整以获得各种颜色。十六进制模型没有该义务，允许您使用十六进制代码选择颜色。但是，该模型本身缺乏颜色处理的灵活性。这就是 RGB 和 HSL 介入的地方。
CSS中的HSLA颜色
weixin_30952103的博客
10-02 198
HSL色彩，是一种工业界的色彩标准，因为它能涵盖到人类视觉所能感知的所有颜色，所以在工业界广泛应用。 H是色度，取值在0度~360度之间，0度是红色，120度是绿色，240度是蓝色。360度也是红色。 S是饱和度，是色彩的纯度，是一个百分比的值，取值在0%~100%，0%饱和度最低，100%饱和度最高 L是亮度，也是一个百分比值，取值在0%~100%，0%最暗，100%最亮。...
CSS颜色与渐变的艺术：HSLA和渐变背景
最新发布
weixin_42608318的博客
05-15 330
本文深入探讨了CSS中的HSLA颜色模式和渐变背景的应用。首先介绍了HSLA颜色模式的直观性和灵活性，然后详细讲解了如何通过HSLA配置颜色并处理不同浏览器对HSLA的支持问题。接着，文章转向CSS渐变的介绍，包括线性渐变和径向渐变的基本语法和效果展示。最后，文章强调了渐进增强设计原则的重要性，以及如何为不支持CSS渐变的浏览器提供回退方案。
CSS中常用的颜色格式
南城
06-28 1165
对于不同的颜色格式，它们之间存在一些重要的区别。本文将带您深入了解这些选项，包括它们的工作原理、如何解析它们以及如何灵活应用
css背景色rgb、rgba、hsl、hsla、opacity的使用详解
lt_1111的博客
08-28 2232
我们先从最简单的例子开始：为整个页面添加背景色。 body { background-color:#f7f7f7; } 也可以使用更简短的写法： body { background:#f7f7f7; } 区别： 第二个属性是第一个属性的简写，通过它可以一次性的设置与背景相关的多个属性。上面的例子中，表面上只声明了背景颜色，实则同时也设置了除背景色之外的其它值（比如图片），只不过把其它属性重置为了默认值。 上面的例子中，颜色值我使用了十六进制的方法表示。所谓十六进制表示法，就是一个#后加上6位十六进制
CSS3新特性：HSL与HSLA的运用与兼容性
weixin_34581040的博客
04-22 398
本文将探讨CSS3中的HSL和HSLA颜色模型，它们是CSS3引入的指定颜色的新方式。文章详细解释了HSL和HSLA的构成，包括色调、饱和度、亮度和透明度，并通过实际例子展示了它们在网页设计中的应用。同时，针对旧版浏览器不支持这些新特性的兼容性问题，提出了相应的解决方案。
css基础知识最后补充：继承、选择器的权重、像素和百分比、em和rem、RGB值、HSL值以及HSLA值（萌新必看，大佬随便）
qq_45623543的博客
11-01 2599
《个人学习笔记十三》 继承 样式的继承，我们为一个元素设置的样式同时也会应用到后代元素上。 继承是发生在祖先后代之间的。 继承的设计是为了方便我们的开发。 利用继承我们可以将一些通用的样式统一设置到共同的祖先元素上。这样只需要设置一次即可，可让所有的元素都具有该样式 注意：并不是所有的样式都会被继承 如 背景、布局相关的，等这些样式都不会被继承。 选择器的权重 样式的冲突 当我们通过不同的选择器，选中相同的元素，并且为相同的样式设置不同的值时，此时就发生了样式的冲突。 发生样式冲突时，应用哪个样式由选择器
《CSS揭秘》引言部分学习：HSLA，box-shadow以及css小技巧
rrrrrio的博客
03-08 381
CSS : HSLA HSLA： Hue 色度（取值：0~360） 红色：0，360 绿色：120 蓝色：240 Saturation 饱和度 （取值：0%~100%） 网上搜索到的定义一般是色彩的鲜艳程度，0%是最黯淡，100%是最鲜艳。 但是通过自己的测试，会发现最黯淡其实就是最贴近灰色，最鲜艳就是不在色度hue上掺杂灰色，最贴近原来的颜色。 最贴近灰色，S:0%： 最贴近原来的颜色，S...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值