css四种导入方式
1 行内样式
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<h1 style="color: blue">我是标题</h1>
</body>
</html>
浏览器翻译如下:

2 页内样式
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head><style>h1{color: green;}</style>
<body>
<h1>我是标题</h1>
</body>
</html>
浏览器翻译如下:

3 外部样式
3.1 链接导入
html文件:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<link rel="stylesheet" href="css/style.css">
<body>
<h1>我是标题</h1>
</body>
</html>
css样式:
/*外部样式*/
h1{color: yellow;
}
目录结构:
浏览器翻译如下:

注意: 当三种样式同时存在时:优先级为【行内样式>页内样式>外部样式】,测试如下:
如下:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<style>h1{color: blue;}
</style>
<link rel="stylesheet" href="css/style.css">
<body>
<h1 style="color: green">我是标题</h1>
</body>
</html>
浏览器翻译如下:

发现当三者同时存在时,行内样式的优先级是最高的。
3.2 @导入式
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head><style>@import url("css/style.css");</style>
<body>
<h1>第四种导入方式</h1>
</body>
</html>
目录结构和上述一致
浏览器翻译如下

相关文章:
css四种导入方式
1 行内样式 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Title</title> </head> <body> <h1 style"color: blue">我是标题</h1> </body> </htm…...
Linux学习第24天:Linux 阻塞和非阻塞 IO 实验(一): 挂起
Linux版本号4.1.15 芯片I.MX6ULL 大叔学Linux 品人间百味 思文短情长 在正式开始今天的笔记之前谈一下工作中遇见的一个问题。 本篇笔记主要学习Linux 阻塞和非阻塞 IO 实验,主要包括阻塞和非阻塞简介、等待队列、轮询、…...
037-第三代软件开发-系统音量设置
第三代软件开发-系统音量设置 文章目录 第三代软件开发-系统音量设置项目介绍系统音量设置QML 实现C 实现 总结一下 关键字: Qt、 Qml、 volume、 声音、 GPT 项目介绍 欢迎来到我们的 QML & C 项目!这个项目结合了 QML(Qt Meta-Obj…...
Python 自动化详解(pyautogui)
文章目录 1 概述1.1 第三方库:pyautogui1.2 坐标说明 2 操作对象2.1 鼠标2.1.1 定位2.1.2 移动2.1.3 拖动2.1.4 滚动2.1.5 点击 2.2 键盘2.2.1 输入2.2.2 按键2.2.3 快捷键 2.3 屏幕2.3.1 截图2.3.2 分辨率 2.4 信息提示2.4.1 提示框2.4.2 选择框2.4.3 密码输入2.4.…...
【Linux】第四站:Linux基本指令(三)
文章目录 一、时间相关的指令1.指令简介2.使用 二、cal指令三、find指令 -name1.介绍2.使用 四、grep指令1.介绍2.使用 五、zip/unzip指令1.介绍2.zip的安装3.使用 六、tar指令:打包解包,不打开它、直接看内容1.介绍2.使用 七、bc指令八、uname -r指令1.…...
SpringBoot内置工具类之断言Assert的使用与部分解析
先例举一个service的demo中用来验证参数对象的封装方法,使用了Assert工具类后是不是比普通的 if(xxx) { throw new RuntimeException(msg) } 看上去要简洁多了? 断言Assert工具类简介 断言是一个判断逻辑,用来检查不该发生的情况ÿ…...
如何检测租用的香港服务器是不是CN2线路呢?
CN2,是中国电信新一代融合承载网络,是为电信自身关键业务和具有QoS保证的SLA业务服务的,可以提供高性能的网络指 标,平均单向时延、最大单向时延、单向丢包率等均属于顶尖水平。简单地说,CN2和普通网络,就像…...
Spring Boot进阶(94):从入门到精通:Spring Boot和Prometheus监控系统的完美结合
📣前言 随着云原生技术的发展,监控和度量也成为了不可或缺的一部分。Prometheus 是一款最近比较流行的开源时间序列数据库,同时也是一种监控方案。它具有极其灵活的查询语言、自身的数据采集和存储机制以及易于集成的特点。而 Spring Boot 是…...
Redis(02)| 数据结构-SDS
一、键值对数据库是怎么实现的? 在开始讲数据结构之前,先给介绍下 Redis 是怎样实现键值对(key-value)数据库的。 Redis 的键值对中的 key 就是字符串对象,而 value 可以是字符串对象,也可以是集合数据类型…...
HackTheBox-Starting Point--Tier 0---Preignition
文章目录 一 题目二 实验过程 一 题目 Tags Web、Custom Applications、Apache、Reconnaissance、Web Site Structure Discovery、Default Credentials译文:Web、定制应用程序、Apache、侦察、网站结构发现、默认凭证Connect To attack the target machine, you …...
售货机相关的电路
一、货道选通矩阵电路,类似扫描电路,驱动哪个电机,就打开相应的行线与列线输出 二、MDB纸币器,虽然现在国内都是手机支付,但如果机器还是外销国外还是有用 三、硬币器电路,投币与退币,脉冲信号…...
软考高项(十四)项目沟通管理 ★重点集萃★
👑 个人主页 👑 :😜😜😜Fish_Vast😜😜😜 🐝 个人格言 🐝 :🧐🧐🧐说到做到,言出必行&am…...
Linux多线程服务端编程:使用muduo C++网络库 学习笔记 第五章 高效的多线程日志
“日志(logging)”有两个意思: 1.诊断日志(diagnostic log)。即log4j、logback、slf4j、glog、g2log、log4cxx、log4cpp、log4cplus、Pantheios、ezlogger等常用日志库提供的日志功能。 2.交易日志(trasac…...
利用Pholcus框架提取小红书数据的案例分析
前言 在当今互联网时代,数据的获取和分析变得越来越重要。爬虫技术作为一种数据采集的方法,被广泛涉及各个领域。在本文中,我们将介绍如何使用Python Spark语言和Pholcus框架来实现一本小红书数据爬虫的案例分析。 开发简述 Go语言作为一种…...
超详细Hadoop安装教程(单机版、伪分布式)
超详细Hadoop安装教程(单机版、伪分布式) 1.Hadoop分布式系统基础架构介绍1.1.Hadoop核心 2.Hadoop安装教程2.1.环境准备2.2.配置用户ssh 免密登录2.3.JAVA环境的安装和配置2.4.Hadoop安装2.5.单机版Hadoop配置2.6.伪分布式Hadoop配置2.7Hadoop初始化 1.…...
持续集成部署-k8s-服务发现-Ingress
持续集成部署-k8s-服务发现-Ingress 1. Ingress 是什么2. Ingress 控制器3. 安装 Ingress-Nginx3.1 添加 Helm 仓库3.2 更新 Helm 仓库3.3 下载 Ingress-Nginx 安装包3.4 配置 Ingress-Nginx 配置文件参数3.5 安装 Ingress-Nginx1. Ingress 是什么 Ingress是 Kubernetes 中的一…...
从零开始搭建Prometheus+grafana服务器组件监控系统
服务器及相关组件监控 本文档主要记录了常用企业级服务器及各种组件的监控手段和监控部署方案,使企业可以实时感知服务器组件的健康状态,并在服务器或组件出现异常时及时做出反应。 本方案采用的Prometheusgrafana的方式实现对服务器及各种组件的监控&am…...
智能水厂运行与调控3D模拟仿真在线展示提高整个系统的协同效应
水厂在生活中的重要性不可忽视。它们提供清洁、安全的水源,满足人们饮用、洗浴、烹饪等基本需求,保障公共卫生,预防疾病传播;同时,水厂也促进经济发展,为工业生产和农业灌溉提供保障,吸引和支持企业的投资和…...
ts声明文件
1 背景 对于为第三方模块/库写声明文件之前,我们需要知道第三方模块/库,是否需要声明文件,或者是否已有声明文件。 若第三方模块/库,是ts编写且无声明文件, 可以使用--declaration配置选项来生成;可以在命…...
JPA联合主键使用
在实际工作中,我们会经常遇到联合主键的情况,所以我用简单例子列举JPA两种实现联合主键的方式。 1、如何通过IdClass 实现联合主键 第一步:新建一个UserInfoID类,里面是联合主键 Data Builder NoArgsConstructor AllArgsConstructor publi…...
终极指南:如何在VSCode中打造你的私人投资情报中心
终极指南:如何在VSCode中打造你的私人投资情报中心 【免费下载链接】leek-fund :chart_with_upwards_trend: 韭菜盒子VSCode插件,可以看股票、基金、期货等实时数据。 LeekFund turns your VS Code and Cursor into a real-time stock, fund, and future…...
5分钟实现位图到矢量图转换:Potrace多色彩矢量化技术深度解析
5分钟实现位图到矢量图转换:Potrace多色彩矢量化技术深度解析 【免费下载链接】vectorizer Potrace based multi-colored raster to vector tracer. Inputs PNG/JPG returns SVG 项目地址: https://gitcode.com/gh_mirrors/ve/vectorizer 在数字图像处理领域…...
YCbCr 转 RGB:揭秘那串神奇公式背后的百年故事
一、一个让我"开窍"的翻译故事 我大学时有个学语言学的朋友,他给我讲过一个让我至今难忘的故事。他说翻译界有一个著名的"中间语言"问题——如果你要把一本书从 50 种语言互相翻译,最笨的办法是给每两种语言之间都准备一个翻译&…...
随机森林在天文大数据中的应用:高红移类星体高效筛选实战
1. 项目概述:用机器学习在星海中“捞针”在广袤的宇宙中寻找高红移类星体,就像是在一片无垠的星海里打捞一根特定的针。高红移类星体,作为宇宙早期最明亮的天体,是研究宇宙再电离时期、超大质量黑洞早期增长以及大尺度结构形成的绝…...
专业级AMD Ryzen调试工具SMUDebugTool:深度解析与实战应用指南
专业级AMD Ryzen调试工具SMUDebugTool:深度解析与实战应用指南 【免费下载链接】SMUDebugTool A dedicated tool to help write/read various parameters of Ryzen-based systems, such as manual overclock, SMU, PCI, CPUID, MSR and Power Table. 项目地址: ht…...
RePKG:终极Wallpaper Engine资源解锁与转换工具
RePKG:终极Wallpaper Engine资源解锁与转换工具 【免费下载链接】repkg Wallpaper engine PKG extractor/TEX to image converter 项目地址: https://gitcode.com/gh_mirrors/re/repkg 你是否曾面对Wallpaper Engine精美的动态壁纸,却苦于无法提取…...
EinDecomp:基于爱因斯坦求和与张量关系代数的自动张量并行分解算法
1. 项目概述:从张量计算的并行困境到EinDecomp的破局思路如果你深度参与过大规模机器学习模型的训练或高维科学计算,一定对“并行”这个词又爱又恨。爱的是,它几乎是处理海量数据和复杂模型的唯一出路;恨的是,为了实现…...
C#实现稳定Windows低级鼠标钩子(WH_MOUSE_LL)全解析
1. 为什么“鼠标钩子”不是炫技,而是解决真实问题的底层能力在Windows桌面应用开发中,我见过太多人把“全局鼠标监听”当成一个玄乎其玄的功能——要么觉得它危险、难搞、容易被杀毒软件误报;要么干脆绕开,用轮询GetCursorPos这种…...
8051开发中禁用自动代码分区的实践指南
1. 禁用自动代码分区的技术背景在8051架构的嵌入式开发中,代码分区(Bank Switching)是一种扩展程序存储器空间的常用技术。传统8051芯片的寻址空间有限,通过分区切换机制可以将代码分布到不同的物理存储区域。Keil C51开发工具链默…...
