HTML_CSS学习：CSS像素与颜色
一、像素
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>像素</title>
</head><style>.atguigu1{/*单位可以是cm，但不能是m,dm*/width: 1cm;height: 1cm;background-color: #f73131;}.atguigu2{/*单位可以是cm、mm，但不能是m,dm*/width: 1mm;height: 1mm;background-color: #f73131;}.atguigu3{/*单位可以是cm、，但不能是m,dm*/width: 100px;height: 100px;background-color: #f73131;}</style>
<body><div class="atguigu1"></div><br><div class="atguigu2"></div><br><div class="atguigu3"></div></body>
</html>二、颜色_第一种表示_颜色名
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>颜色名</title><style>.atguigu{color: blue;}</style>
</head>
<body><h2 class="atguigu">尚硅谷</h2></body>
</html>三、颜色_第二种表示_rgb或rgba
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>rgb和rgba表示</title><style>.atguigu1{color: rgb(255,0,0);}.atguigu2{color: rgb(0,255,0);}.atguigu3{color: rgb(0,0,255);}.atguigu4{color: rgb(133,43,226);}.atguigu5{color: rgb(100%,0%,0%);}.atguigu6{color: rgba(255,0,0,0.5);}.atguigu7{color: rgb(50,50,50);}</style>
</head>
<body><h2 class="atguigu1">尚硅谷1</h2><h2 class="atguigu2">尚硅谷2</h2><h2 class="atguigu3">尚硅谷3</h2><h2 class="atguigu4">尚硅谷4</h2><h2 class="atguigu5">尚硅谷5</h2><h2 class="atguigu6">尚硅谷6</h2><h2 class="atguigu7">尚硅谷7</h2></body>
</html>四、颜色_第三种表示_HEX或HEXA
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>HEX或HEXA</title>
</head><style>.atguigu1{/*#color: #第一组第二组第三组;没两位一组，16进制*/color: #af17bf;}.atguigu2{/*#color: #第一组第二组第三组;没两位一组，16进制*/color: #7fbf17;}.atguigu3{/*#color: #第一组第二组第三组;没两位一组，16进制*/color: #be9b29;}.atguigu4{/*#color: #第一组第二组第三组;没两位一组，16进制*/color: #c7edcc;}.atguigu5{/*#color: #第一组第二组第三组;没两位一组，16进制*/color: #87ceebff;/*带有透明度*/}/*HEXA是8位最后1两位是透明度*/</style>
<body><h2 class="atguigu1">尚硅谷1</h2><h2 class="atguigu2">尚硅谷2</h2><h2 class="atguigu3">尚硅谷3</h2><h2 class="atguigu4">尚硅谷4</h2><h2 class="atguigu5">尚硅谷5</h2></body>
</html>五、颜色_第五种表示_HSL或HSAL
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>HSL或HSLA</title><style>.atguigu1{/*color: hsl(色相，饱和度，亮度);*/color:hsl(0, 100%, 50%);}.atguigu2{/*color: hsl(色相，饱和度，亮度);*/color:hsl(60, 100%, 50%);}.atguigu3{/*color: hsl(色相，饱和度，亮度);*/color:hsl(120, 100%, 50%);}.atguigu4{/*color: hsl(色相，饱和度，亮度);*/color:hsl(180, 100%, 50%);}.atguigu5{/*color: hsl(色相，饱和度，亮度);*/color:hsl(240, 100%, 50%);}.atguigu6{/*color: hsl(色相，饱和度，亮度);*/color:hsl(300, 100%, 50%);.atguigu7{/*color: hsl(色相，饱和度，亮度);*/color:rgba(300, 100%, 50%, 0.55);}</style>
</head>
<body><h2 class="atguigu1">尚硅谷1</h2><h2 class="atguigu2">尚硅谷2</h2><h2 class="atguigu3">尚硅谷3</h2><h2 class="atguigu4">尚硅谷4</h2><h2 class="atguigu5">尚硅谷5</h2><h2 class="atguigu6">尚硅谷6</h2><h2 class="atguigu7">尚硅谷7</h2></body>
</html>相关文章：
HTML_CSS学习：CSS像素与颜色
一、像素 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>像素</title> </head><style>.atguigu1{/*单位可以是cm，但不能是m,dm*/width: 1cm;height: 1cm;background-c…...
华为交换机配置导出备份python脚本
一、脚本编写思路 （一）针对设备型号 主要针对华为（Huawei）和华三（H3C）交换机设备的配置备份 （二）导出前预处理 1.在配置导出前，自动打开crt软件或者MobaXterm软件&am…...
DS：时间复杂度和空间复杂度
欢迎各位来到 Harper.Lee 的学习世界！ 博主主页传送门：Harper.Lee的博客主页 想要一起进步的uu欢迎来后台找我哦！ 本片博客主要介绍的是数据结构中关于算法的时间复杂度和空间复杂度的概念。 一、算法 1.1 什么是算法？ 算法(Alg…...
AI跟踪报道第41期-新加坡内哥谈技术-本周AI新闻：本周Al新闻: 准备好了吗？事情即将変得瘋狂
每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗？订阅我们的简报，深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同，从行业内部的深度分析和实用指南中受益。不要错过这个机会，成为AI领…...
Go 之 interface接口理解
go语言并没有面向对象的相关概念，go语言提到的接口和java、c等语言提到的接口不同，它不会显示的说明实现了接口，没有继承、子类、implements关键词。go语言通过隐性的方式实现了接口功能，相对比较灵活。 interface是go语言的一大…...
简约在线生成短网址系统源码 短链防红域名系统 带后台
简约在线生成短网址系统源码 短链防红域名系统 带后台 安装教程：访问 http://你的域名/install 进行安装 源码免费下载地址抄笔记 (chaobiji.cn)https://chaobiji.cn/...
设置默认表空间和重命名
目录 设置默认表空间 创建的临时表空间 tspace4 修改为默认临时表空间 创建的永久性表空间 tspace3 修改为默认永久表空间 重命名表空间 将表空间 tspace3 修改为 tspace3_1 Oracle从入门到总裁:https://blog.csdn.net/weixin_67859959/article/details/13520…...
Hive大表join大表如何调优
目录 一、调优思路1、SQL优化1.1 大小表join1.2 大大表join 2、insert into替换union all3、排序order by换位sort by4、并行执行5、数据倾斜优化6、小文件优化 二、实战2.1 场景2.2 限制所需的字段，间接mapjoin2.2 解决异常值倾斜，如NULL加随机数打散2.…...
SAF文件选择、谷歌PhotoPicker图片视频选择与真实路径转换
一、构建选择文件与回调方法 //文件选择回调ActivityResultLauncher<String[]> pickFile registerForActivityResult(new ActivityResultContracts.OpenDocument(), uri->{if (uri ! null) {Log.e("cxy", "返回的uri:" uri);Log.e("cxy&q…...
java可变参数
前言 我们虽然能够用重载实现，但多个参数无法弹性匹配 代码 class mycalculator{//下面的四个calculate方法构成了重载//计算2个数的和，3个数的和，4，5，6个数的和// public void calculate(int n1){// System.out.…...
Flutter 中的 Expanded 小部件：全面指南
Flutter 中的 Expanded 小部件：全面指南 在 Flutter 中，Expanded 是一个用于控制子控件占据可用空间的布局小部件，通常与 Row、Column 或 Flex 等父级布局小部件一起使用。Expanded 允许你创建灵活的布局，其中子控件可以按照指定…...
[Kubernetes] KubeKey 部署 K8s v1.28.8
文章目录 1.K8s 部署方式2.操作系统基础配置3.安装部署 K8s4.验证 K8s 集群5.部署测试资源 1.K8s 部署方式 kubeadm: kubekey, sealos, kubespray二进制: kubeaszrancher 2.操作系统基础配置 主机名内网IP外网IPmaster192.168.66.2139.198.9.7node1192.168.66.3139.198.40.17…...
C# 与 Qt 的对比分析
C# 与 Qt 的对比分析 目录 C# 与 Qt 的对比分析 1. 语言特性 2. 开发环境 3. 框架和库 4. 用户界面设计 5. 企业级应用 6. 性能考量 在软件开发领域，C# 和 Qt 是两种常用的技术栈，它们分别在.NET平台和跨平台桌面应用开发中占据重要位置。本文将深…...
MapReduce | 二次排序
1.需求 主播数据--按照观众人数降序排序，如果观众人数相同，按照直播时长降序 # 案例数据 用户id 观众人数 直播时长 团团 300 1000 小黑 200 2000 哦吼 400 7000 卢本伟 100 6000 八戒 250 5000 悟空 100 4000 唐僧 100 3000 # 期望结果 哦吼 4…...
Java后端初始化项目（项目模板）
介绍 emmmm，最近看了一些网络资料，也是心血来潮，想自己手工搭建一个java后端的初始化项目模板来简化一下开发，也就发一个模板的具体制作流程，（一步一步搭建，从易到难） okÿ…...
electron 多窗口 vuex/pinia 数据状态同步简易方案（利用 LocalStorage）
全局 stroe 添加 mutations 状态同步方法 // 用于其他窗口同步 vuex 中的 DeviceTcpDataasyncDeviceTcpData(state: StateType, data: any) {state.deviceTcpData data},App.vue 里 onMounted(() > {console.log("App mounted");/*** vuex 多窗口 store 同步*//…...
自定义数据集图像分类实现
模型训练 要使用自己的图片分类数据集进行训练，这意味着数据集应该包含一个目录，其中每个子目录代表一个类别，子目录中包含该类别的所有图片。以下是一个使用Keras和TensorFlow加载自定义图片数据集进行分类训练的例子。 我们自己创建的数据集…...
【C++】手搓读写ini文件源码
【C】手搓读写ini文件源码 思路需求：ini.hini.cppconfig.confmian.cpp 思路 ini文件是一种系统配置文件，它有特定的格式组成。通常做法，我们读取ini文件并按照ini格式进行解析即可。在c语言中，提供了模板类的功能，所以…...
undolog
undolog回滚段 undolog执行的时间：在执行器操作bufferpool之前。 undolog页...
项目文档分享
Hello , 我是小恒。提前祝福妈妈母亲节快乐 。 本文写一篇初成的项目文档 （不是README.md哈），仅供参考 项目名称 脚本存储网页 项目简介 本项目旨在创建一个网页，用于存储和展示各种命令，用户可以通过粘贴复制命令到…...
2026年三维扫描仪选购指南：专业厂家如何选，这几点是关键
在工业4.0与智能制造浪潮的推动下，三维扫描技术已成为产品设计、逆向工程、质量检测等领域的核心工具。面对市场上琳琅满目的品牌与型号，如何选择一台真正适合自身需求、性能可靠的三维扫描仪，成为众多工程师、设计师和企业决策者面临的难题。…...
Z-Image-Turbo-辉夜巫女快速入门：10分钟完成Dify工作流集成与调用
Z-Image-Turbo-辉夜巫女快速入门：10分钟完成Dify工作流集成与调用 想在自己的应用里快速加上AI画图功能，但又不想写一堆复杂的代码？今天咱们就来聊聊怎么把Z-Image-Turbo-辉夜巫女这个挺火的图像生成模型，轻松集成到Dify平台的工…...
)
深入浅出：从原理到实践，手把手教你理解并校准RV1126 ISP的黑电平(BLC)
深入浅出：从原理到实践，手把手教你理解并校准RV1126 ISP的黑电平(BLC) 在数字图像处理领域，黑电平校准（Black Level Calibration, BLC）是一个看似简单却至关重要的环节。想象一下，当你用专业相机拍摄星空时…...
AUTOSAR NM实战避坑：从CANoe仿真到实车调试，搞定ECU异常唤醒与睡眠失败
AUTOSAR NM实战避坑指南：从仿真到实车的异常唤醒与睡眠失败解决方案 当ECU在深夜本该沉睡时突然"睁眼"，消耗的不仅是电量，更是工程师的睡眠时间。这种场景在AUTOSAR网络管理（NM）开发中屡见不鲜——某个节点异…...
从‘发快递’到‘收快递’：手把手拆解RocketMQ 5.x中Producer Group的变迁与最佳实践
从‘发快递’到‘收快递’：手把手拆解RocketMQ 5.x中Producer Group的变迁与最佳实践 在消息中间件的世界里，RocketMQ一直以其高吞吐、低延迟的特性占据着重要地位。随着5.x版本的发布，一个看似微小的改动——生产者匿名化，却在实…...
告别Bad Username or Password：手把手教你用MQTTX正确连接OneNET物联网开发平台（附Token生成避坑点）
物联网开发实战：OneNET平台MQTT连接全流程解析与避坑指南 在物联网项目开发中，MQTT协议因其轻量级和高效性成为设备连接的首选方案。而OneNET作为国内主流的物联网平台，为开发者提供了完整的MQTT接入能力。但在实际对接过程中，&q…...
Endnote与WPS高效协作：自动与手动关联全攻略
1. Endnote与WPS关联的必要性 对于科研人员和学术写作者来说，文献管理是日常工作中不可或缺的一部分。Endnote作为一款专业的文献管理软件，能够帮助我们高效地整理、引用和分享文献资料。而WPS Office则是国内广泛使用的办公软件，许多用户习惯…...
Ostrakon-VL扫描终端实战教程：像素特工式零售图像识别部署指南
Ostrakon-VL扫描终端实战教程：像素特工式零售图像识别部署指南 1. 像素特工终端介绍 想象你是一位未来世界的零售侦探，手持高科技扫描仪在商店里穿梭。Ostrakon-VL扫描终端就是你的数字助手，它能帮你"看"懂货架上的每一个细节。这…...
Fish Speech 1.5 Web界面保姆级教程：上传参考音频→文本对齐→语音生成全链路
Fish Speech 1.5 Web界面保姆级教程：上传参考音频→文本对齐→语音生成全链路 你是不是也想用AI生成和自己声音一模一样的语音？Fish Speech 1.5就能帮你实现这个愿望！这个强大的语音合成工具不仅能生成自然流畅的语音，还能通过参…...
Dan Koe: 如果你有多重兴趣，请不要浪费接下来的2-3年
本文整理自 Dan Koe 原文。Dan Koe 是 YouTube、X 等平台拥有数百万粉丝的个人成长领域创作者，以"一人公司"理念、深度内容创作和高效 AI 工作流著称。你是否曾因为无法只专注一件事而感到自责？ 你学设计，又想学编程；读…...