当前位置：首页 > news >正文

Html5+Css3学习笔记

news 2025/12/16 3:06:50

Html5 + CSS3

一、概念

1.什么是html5

html: Hyper Text Markup Language ( 超文本标记语言)

文本：记事本

超文本：文字、图片、音频、视频、动画等等（网页）

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

html语言经过浏览器的编译显示成超文本

开发者使用5种浏览器（拥有不同的内核）

edge，谷歌，firefox，safari, 欧朋浏览器

国内目前的浏览器用的还是google的内核

谷歌性能最好，v8引擎，解析速度高

2.什么是css3

css: Cascading Style Sheet ( 级联样式表)

作用：美化网页

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

3.w3c标准

w3c： World Wide Web Consortium （万维网联盟）

成立于1994 年，web技术领域最权威最具有影响力的国际中立性技术标准机构

官网：https://www.w3.org/

W3C标准包括：

结构化标准化语言（HTML、XML）
表现标准语言（css）
行为标准（javaScript — DOM、ECMAScript）

4.前端学什么？

结构化标准化语言（HTML、XML）骨架
表现标准语言（css）皮囊
行为标准（javaScript — DOM、ECMAScript）动画交互

二、开发工具

VSCode官网

三、html和css的语法

1.基本语法

1.1html的语法

在vscode 直接打html就会自动给出基本格式

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body></body>
</html>

1.2html的标签

1. 标签的基本结构

HTML标签通常由尖括号<和>包围的关键词构成，如<html>。
大多数HTML标签是成对出现的，称为双标签。例如，<html>和</html>分别作为HTML文档的开始和结束标签。第一个标签是开始标签，第二个标签是结束标签，它们之间的内容构成了标签的主体。
有些特殊的标签是单个标签，称为单标签或自闭合标签，例如<br />用于换行，它不需要结束标签。

2. 标签的分类

HTML标签可以根据其功能分为不同的类型，包括但不限于以下几种：

结构标签：用于定义HTML文档的整体结构，如<html>、<head>、<body>等。
文本格式化标签：用于改变文本的显示方式，如<h1>到<h6>用于定义六级标题，<p>用于定义段落，<br />用于换行等。
链接标签：用于创建超链接，如<a href="URL">链接文本</a>。
图像标签：用于在HTML页面中嵌入图像，如<img src="图像URL" alt="图像描述" />。
列表标签：用于创建列表，包括无序列表<ul>和有序列表<ol>，以及列表项<li>。
表格标签：用于创建表格，包括<table>、<tr>（表格行）、<th>（表头单元格）、<td>（表格单元格）等。
表单标签：用于创建表单，收集用户输入，包括<form>、<input>、<textarea>、<select>等。
布局标签：如<div>和<span>，用于布局和样式控制。<div>是块级元素，通常用于布局；<span>是行内元素，用于对文本的某部分进行样式控制。

1.3css的语法

选择器 {声明1;声明2;
}
如：
h1 {font-size: 50px;color: 'red'
}

1.4 入门代码

<!DOCTYPE html>
<html lang="en"> <!-- 设置语言为英语 -->
<head><meta charset="UTF-8"> <!-- 设置网页编码格式 UTF-8是国际编码，支持各种语言 --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 使页面在手机上自适应 --> <title>02css基本语法</title><style>h1 {font-size: 50px;  /*font：字体， font-size：字体大小， px为像素*/font-family: '宋体'; /*字体类型*/font-weight:bold;   /*字体粗细  bold:就是600*/font-style:normal;  /*italic:斜体*/color: #00f;  /*颜色可以三种表示方式：英文 red、pink   rgb(250,0,0)    十六进制: #000000两位表示，但是两位相同可以用一位简写 如#00f */}</style>
</head>
<body><h1>我爱中国</h1><h2>我爱中国</h2><h3>我爱中国</h3><h4>我爱中国</h4><h5>我爱中国</h5><h6>我爱中国</h6>我爱世界
</body>
</html>

经验：css的最后一条声明的“；”是可以不写的，但是W3C规范建议最后一条声明的结束也要把“；”写上

h1为标题标签

数字越大，字号越小,占据了一整行

html中的注释格式为

css中的注释格式为/* */

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

2.html种引入CSS样式

三种引入方式

行内样式
内部样式表
外部样式表

2.1 行内样式

样式写在标签里面

示例代码：

<h1 style="color: red;font-size: 50px;">行内样式</h1>
<h1 style="color: red;">行内样式</h1>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

2.2 内部样式表

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>h1 {color: red;}</style>
</head>
<body><h1>标题1</h1><h1>标题1</h1>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

css语言写在style标签里，但还是在代码内部

优点
- 方便在同一个页面种修改样式
缺点
- 不利于多页面之间共享复用代码及维护，对内容于样式的分离不够彻底

2.3 外部样式表

css代码全部保存在扩展名为.css的样式中

HTML文件引用扩展名为.css样式表，有两种方式:

链接式

语法：
<head><link href="css/style.css" rel="stylesheet" type="text/css" />
</head>href:文件路径
rel:使用外部样式表，固定写法stylesheet
type:文件类型 (不是必须的)

案例：
common.css存放以下css代码h1 {font-size: 200px;color: red;
}---------------------------------------------------------------------------------------------<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>05外部样式表-链接式</title><!-- 相对路径/绝对路径,推荐使用相对路径./ 表示当前文件夹 ../表示上一级文件夹 --><link rel="stylesheet" href="./css/common.css" />
</head>
<body><h1>Hello  外部样式-链接式</h1>
</body>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

导入式

# 语法：
<head><style><!--@import url('css的地址')--></style>
</head>

案例：<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>06外部样式表-导入式</title><style type="text/css"><!-- @import url('./css/common.css');    --></style>
</head>
<body><h1>坤坤爱篮球</h1>
</body>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

链接式和导入式的区别：

标签是属于XHTML，@import是属于css2.1（版本落后）
使用链接的css文件先加载到网页种，再进行编译显示。而@import导入的css文件，客户端先显示HTML结构，再把css文件加载到网页中。link不会因为网速慢，先加载出未经美化的超文本
@import是属于CSS2.1特有的，对不兼容CSS2.1的浏览器是无效的

现在基本不使用导入式

3.CSS样式优先级

遵从如下原则：

行内样式 > 内部样式表 > 外部样式表
就近原则

代码示例：

h1 {font-size: 50px;color: red;
}

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>07css样式优先级</title><link rel="stylesheet" href="./css/style.css"> 外部演示表的样式<style> 内部样式表的样式h1 {color: blue;}h2 {color: red;}h2 {color: blue;}</style>
</head>
<body><h1 style="color: green;">北京欢迎你</h1>  行内样式表的样式<h2>武汉欢迎你</h2>
</body>
</html>

如果有多个相同的样式，最后一个会覆盖前面的，不相同的样式会叠加

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

4.CSS基本选择器

4.1 标签选择器

语法：

标签名 {属性：值;
}如：
h1 {font-size: 20px;
}

案例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>p {font-size: 16px;color: red;}</style>
</head>
<body><p>2024年6月份，全国居民消费价格同比上涨0.2%。其中，城市上涨0.2%，农村上涨0.4%；食品价格下降2.1%，非食品价格上涨0.8%；消费品价格下降0.1%，服务价格上涨0.7%。1—6月平均，全国居民消费价格比上年同期上涨0.1%。</p>
</body>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

4.2 类选择器

语法：

<style>.类名 {属性:值;}
</style><标签名 class="类名"></标签名>

案例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>09类选择器</title><style>.mycolor{color: blue;}.mysize {font-size: 50px;}</style>
</head>
<body><!-- 语法：如果有多个类选择器，可以在后面空格继续加 --><p class="mycolor mysize">我爱编程</p><font class="mycolor">Hello</font>
</body>
</html>

作用：可以多次使用

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

4.3 ID选择器

语法：

<style>#id选择器名称 {属性:值;}
</style><标签名 id="id选择器名称"></标签名>

案例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>/* 不要以数字开头 */#first {font-size: 50px;}</style>
</head>
<body><p id="first">北京欢迎你</p>
</body>
</html>

标签选择器直接应用于html标签
类选择器，可以在页面中多次使用
id选择器，在同一个页面中只能使用一次。（实际上可以用多次，但是为了确保唯一性制定出来的规范）

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

4.4 优先级

ID选择器 > 类选择器 > 标签选择器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>11选择器的优先级</title><style>/* 类选择器 */.blueColor {color: blue;}/* 标签选择器 */p {color: green;}/* id选择器 */#colorPink{color: pink;}</style>
</head>
<body><p class="blueColor" id="colorPink">我爱编程</p>
</body>
</html>

5. CSS的高级选择器

层次选择器
结构伪类选择器
属性选择器

5.1 层次选择器

选择器	类型	功能描述
E F	后代选择器	选择匹配的F元素，且匹配的F元素包含在匹配的E元素内
E>F	子选择器	选择匹配的F元素，且匹配的F元素是匹配的E元素的子元素
E+F	相邻兄弟选择器	选择匹配的F元素，且匹配的F元素紧位于匹配的E元素后面
E~F	通用兄弟选择器	选择匹配的F元素，且位于匹配的E元素后的所有匹配的F元素

前两个可能有用

后代选择器案例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>p font {color: red;}</style>
</head>
<body><!-- 儿孙后代 --><p>我爱中国,<font>我<span>爱</span>世界</font></p><font>我爱编程</font>
</body>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

子选择器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>/* 子选择器 */p>span {color: red;}</style>
</head>
<body><!-- 儿孙后代 --><p>我爱中国,<font>我<span>爱</span>世界</font></p><p>我爱编程,<span>我爱html</span></p>
</body>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传、

相邻兄弟选择器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div+p{color: blue;}</style>
</head>
<body><div>我爱编程<p>我爱世界</p><span>我爱湖北</span></div><p>我爱世界</p><p>我爱世界22</p>
</body>
</html>

通用兄弟选择器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div~p {color: red;}</style>
</head>
<body><div>我爱中国 <p>我爱世界</p></div><p>我爱编程</p><p>我爱学习</p>
</body>
</html>

5.2 结构伪类选择器

E:first-child	作为E的第一个子元素
E:last-child	作为最后一个子元素
E:nth-child(n)	第n个子元素
E:first-of-type	选择父元素内具有指定类型的第一个E元素
E:last-of-type
E F:nth-of-type(n)	选择父元素内具有指定类型的第n个F元素

前三个够了

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>16结构伪类选择器</title><style>/*给第一个li设置颜色为红色*/ul li:first-child {color: red;}/*给li中的最后一个设置颜色为蓝色*/ul li:last-child {color: blue;}/*给中间第二个孩子设置颜色为绿色*/ul li:nth-child(2){color: green;}/*给第2个p设置字体大小为50px*/p:nth-child(2) {font-size: 50px;}</style>
</head>
<body><p>p1</p><p>p2</p><p>p3</p><ul><li>li1</li><li>li2</li><li>li3</li></ul>
</body>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

5.3 属性选择器

属性选择器	功能描述
E[attr]	选择匹配具有属性attr的E元素
E[attr=val]	选择匹配具有属性attr的E元素，且属性为val
E[attr^=val]	选择匹配元素E，且E元素定义了属性attr，其属性值以val开头的任意字符串
E[attr$=val]	选择匹配元素E，且E元素定义了属性attr，其属性值以val结尾的任意字符串
E[attr*=val]	只要包含了val的任意字符串

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>17属性选择器</title><style>.demo a {width: 50px;height: 50px;}a[id] {background-color: yellow;}a[id=green] {background-color: green;}a[id=blue] {background-color: blue;}a[id=yellow] {background-color: yellow;}a[href^=http] {background-color: pink;}a[href$=cn] {background-color: black;}a[href*=ba] {font-size:  50px;}</style>
</head>
<body><p class="demo"><a href="http://www.baidu.com" target="_self" id="green">百度</a><a href="#">京东</a><a href="http://www.alibaba.cn">阿里</a><a href="https://www.thepaper.cn">澎湃</a></p></body>
</html>

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

四、总结

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

Html5+Css3学习笔记

Html5 CSS3 一、概念 1.什么是html5 html: Hyper Text Markup Language ( 超文本标记语言) 文本：记事本超文本： 文字、图片、音频、视频、动画等等（网页） html语言经过浏览器的编译显示成超文本开发者使用5种浏览器&#xf…...

编程日记 2024/7/14 15:45:59

一、代码 <Window x:Class"学习.MainWindow"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d"http://schemas.microsoft.com/expression/blend/2008&…...

编程日记 2024/7/14 15:38:53

独家揭秘！五大内网穿透神器，访问你的私有服务

本文精心筛选了五款炙手可热的内网穿透工具，它们各怀绝技，无论您是企业用户、独立开发者，还是技术探索者，这篇文章都物有所值，废话不多说，主角们即将上场。目录 1. 巴比达 - 安全至上的企业护航者 2. 花…...

编程日记 2024/7/14 15:37:52

Ubuntu 编译和运行ZLMediaKit

摘要本文描述了如何在Ubuntu上构建ZLMediaKIt项目源码，以及如何体验其WebRTC推流和播放功能。实验环境操作系统版本：Ubuntu 22.04.3 LTS gcc版本：11.4.0 g版本：11.4.0 依赖库安装 #让ZLMediaKit媒体服务器具备WebRTC流转发…...

编程日记 2024/7/14 15:36:51

基于JavaSpringBoot+Vue+uniapp微信小程序校园宿舍管理系统设计与实现

基于JavaSpringBootVueuniapp微信小程序实现校园宿舍管理系统设计与实现目录第一章绪论 1.1 研究背景 1.2 研究现状 1.3 研究内容第二章相关技术介绍 2.1 Java语言 2.2 HTML网页技术 2.3 MySQL数据库 2.4 Springboot 框架介绍 2.5 VueJS介绍 2.6 ElementUI介绍…...

编程日记 2024/7/14 15:35:50

Hive的基本操作（创建与修改）

必备知识数据类型基本类型类型写法字符char, varchar, string✔整数tinyint, smallint, int✔, bigint✔小数float, double, numeric(m,n), decimal(m,n)✔布尔值boolean✔时间date✔, timestamp✔ 复杂类型(集合类型) 1、数组：array<T> 面向用户提供…...

编程日记 2024/7/14 15:34:49

Linux开发讲课37--- ARM的22个常用概念

1. ARM中一些常见英文缩写解释 MSB：最高有效位； LSB：最低有效位； AHB：先进的高性能总线； VPB：连接片内外设功能的VLSI外设总线； EMC：外部存储器…...

编程日记 2024/7/14 15:33:48

7-1、2、3 IPFS介绍使用及浏览器交互（react+区块链实战）

7-1、2、3 IPFS介绍使用及浏览器交互（react区块链实战） 7-1 ipfs介绍7-2 IPFS-desktop使用7-3 reactipfs-api浏览器和ipfs交互 7-1 ipfs介绍 IPFS区块链上的文件系统 https://ipfs.io/ 这个网站本身是需要科学上网的 Ipfs是点对点的分布式系统无限…...

编程日记 2024/7/14 15:32:41

CentOS 7 中出现 cannot open Packages database in /var/lib/rpm 错误

转载自:https://www.jianshu.com/p/423306f43e72 # 进入 rpmdb 所在目录 [roothostbase ~]# cd /var/lib/rpm [roothostbase rpm]# ls Basenames __db.001 __db.003 Group Name Packages Requirename Sigmd5 Conflictname __db.002 Dirnames Ins…...

编程日记 2024/7/14 15:29:39

【java深入学习第6章】深入解析Spring事件监听机制

在Spring框架中，事件监听机制是一个强大且灵活的功能，允许我们在应用程序中发布和监听事件。这种机制可以帮助我们实现松耦合的设计，使得不同模块之间的通信更加灵活和可维护。本文将详细介绍Spring的事件监听机制，并通过代码示例…...

编程日记 2024/7/14 15:28:37

Flask与Celery实现Python调度服务

文章目录 Flask与Celery实现Python调度服务一、前言1.组件2.场景说明3.环境二、安装依赖1.安装Anaconda3.安装redis2.安装依赖包三、具体实现1.目录结构2.业务流程3.配置文件4.Celery程序5.Flask程序6.测试脚本7.程序启动1）Windows开发调试2）Linux服务…...

编程日记 2024/7/14 15:27:36

Eureka应用场景和优势

Eureka是一款由Netflix开源的服务注册与发现框架，在微服务架构中扮演着至关重要的角色。以下是Eureka的应用场景和优势： Eureka的应用场景 Eureka主要应用于微服务架构中，特别是在大型、复杂的分布式系统中，用于管理和发现服务。…...

编程日记 2024/7/14 15:26:35

prompt第三讲-PromptTemplate

文章目录前提回顾PromptTemplateprompt 模板定义以f-string渲染格式以mustache渲染格式以jinja2渲染格式直接实例化PromptTemplatePromptTemplate核心变量 prompt value生成invokeformat_prompt(不建议使用)format(不建议使用) batchstreamainvoke PromptTemplate核心方法part…...

编程日记 2024/7/14 15:24:33

卷积神经网络图像识别车辆类型

卷积神经网络图像识别车辆类型 1、图像自行车：汽车：摩托车： 2、数据集目录 3、流程 1、获取数据，把图像转成矩阵，并随机划分训练集、测试集 2、把标签转为数值，将标签向量转换为二值矩阵 3、图像数据归一化，0-1之间的值 4、构造卷积神经网络 5、设置图像输入…...

编程日记 2024/7/14 15:16:25

【接口设计】用 Swagger 实现接口文档

用 Swagger 实现接口文档 1.配置 Swagger1.1 添加 Swagger 依赖1.2 创建 Swagger 配置类 2.编写接口文档在项目开发中，一般都是由前后端工程师共同定义接口，编写接口文档，之后大家根据这个接口文档进行开发、维护。为了便于编写和维护稳定&a…...

编程日记 2024/7/14 15:13:22

TensorFlow系列：第四讲：MobileNetV2实战

一. 加载数据集编写工具类，实现数据集的加载 import keras""" 加载数据集工具类 """class DatasetLoader:def __init__(self, path_url, image_size(224, 224), batch_size32, class_modecategorical):self.path_url path_urlself…...

编程日记 2024/7/14 15:07:15

Redis+Caffeine 实现两级缓存实战

RedisCaffeine 实现两级缓存背景事情的开始是这样的，前段时间接了个需求，给公司的商城官网提供一个查询预计送达时间的接口。接口很简单，根据请求传的城市仓库发货时间查询快递的预计送达时间。因为商城下单就会调用这个接口&#xff…...

编程日记 2024/7/14 15:05:14

SpringBoot：SpringBoot中如何实现对Http接口进行监控

一、前言 Spring Boot Actuator是Spring Boot提供的一个模块，用于监控和管理Spring Boot应用程序的运行时信息。它提供了一组监控端点（endpoints），用于获取应用程序的健康状态、性能指标、配置信息等，并支持通过 HTTP …...

编程日记 2024/7/14 15:01:09

STM32-I2C硬件外设

本博文建议与我上一篇I2C 通信协议共同理解合成一套关于I2C软硬件体系 STM32内部集成了硬件I2C收发电路，可以由硬件自动执行时钟生成、起始终止条件生成、应答位收发、数据收发等功能，减轻CPU的负担特点： 多主机功能&#x…...

编程日记 2024/7/14 14:58:06

暑假第一次作业

第一步：给R1,R2,R3,R4配IP [R1-GigabitEthernet0/0/0]ip address 192.168.1.1 24 [R1-Serial4/0/0]ip address 15.0.0.1 24 [R2-GigabitEthernet0/0/0]ip address 192.168.2.1 24 [R2-Serial4/0/0]ip address 25.0.0.1 24 [R3-GigabitEthernet0/0/0]ip address 192.…...

编程日记 2024/7/14 14:57:05

关于iview组件中使用 table , 绑定序号分页后序号从1开始的解决方案

问题描述：iview使用table 中type: "index",分页之后 ，索引还是从1开始，试过绑定后台返回数据的id, 这种方法可行，就是后台返回数据的每个页面id都不完全是按照从1开始的升序，因此百度了下，找到了…...

编程新知 2025/12/13 5:10:30

pam_env.so模块配置解析

在PAM（Pluggable Authentication Modules）配置中， /etc/pam.d/su 文件相关配置含义如下： 配置解析 auth required pam_env.so1. 字段分解字段值说明模块类型auth认证类模块，负责验证用户身份&am…...

编程新知 2025/10/5 8:09:39

Mac软件卸载指南，简单易懂！

刚和Adobe分手，它却总在Library里给你写"回忆录"？卸载的Final Cut Pro像电子幽灵般阴魂不散？总是会有残留文件，别慌！这份Mac软件卸载指南，将用最硬核的方式教你"数字分手术"&#xff0…...

编程新知 2025/12/14 10:18:18

安宝特案例丨Vuzix AR智能眼镜集成专业软件，助力卢森堡医院药房转型，赢得辉瑞创新奖

在Vuzix M400 AR智能眼镜的助力下，卢森堡罗伯特舒曼医院（the Robert Schuman Hospitals, HRS）凭借在无菌制剂生产流程中引入增强现实技术（AR）创新项目，荣获了2024年6月7日由卢森堡医院药剂师协会&#xff0…...

编程新知 2025/12/14 2:31:21

搭建DNS域名解析服务器(正向解析资源文件)

正向解析资源文件 1）准备工作服务端及客户端都关闭安全软件 [rootlocalhost ~]# systemctl stop firewalld [rootlocalhost ~]# setenforce 0 2）服务端安装软件：bind 1.配置yum源 [rootlocalhost ~]# cat /etc/yum.repos.d/base.repo [Base…...

编程新知 2025/12/13 12:30:45

STM32---外部32.768K晶振（LSE）无法起振问题

晶振是否起振主要就检查两个1、晶振与MCU是否兼容；2、晶振的负载电容是否匹配目录一、判断晶振与MCU是否兼容二、判断负载电容是否匹配 1. 晶振负载电容（CL）与匹配电容（CL1、CL2）的关系 2. 如何选择 CL1 和 CL…...

编程新知 2025/12/15 14:26:27

解析奥地利 XARION激光超声检测系统：无膜光学麦克风 + 无耦合剂的技术协同优势及多元应用

在工业制造领域，无损检测（NDT)的精度与效率直接影响产品质量与生产安全。奥地利 XARION开发的激光超声精密检测系统，以非接触式光学麦克风技术为核心，打破传统检测瓶颈，为半导体、航空航天、汽车制造等行业提供了高灵敏…...

编程新知 2025/12/7 20:44:17

wpf在image控件上快速显示内存图像

wpf在image控件上快速显示内存图像https://www.cnblogs.com/haodafeng/p/10431387.html 如果你在寻找能够快速在image控件刷新大图像（比如分辨率3000*3000的图像）的办法，尤其是想把内存中的裸数据（只有图像的数据，不包…...

编程新知 2025/12/13 5:43:36

Spring Security 认证流程——补充

一、认证流程概述 Spring Security 的认证流程基于过滤器链（Filter Chain），核心组件包括 UsernamePasswordAuthenticationFilter、AuthenticationManager、UserDetailsService 等。整个流程可分为以下步骤： 用户提交登录请求拦…...

编程新知 2025/12/13 12:28:47

电脑桌面太单调，用Python写一个桌面小宠物应用。

下面是一个使用Python创建的简单桌面小宠物应用。这个小宠物会在桌面上游荡，可以响应鼠标点击，并且有简单的动画效果。 import tkinter as tk import random import time from PIL import Image, ImageTk import os import sysclass DesktopPet:def __i…...

编程新知 2025/8/10 0:53:59

Html5 + CSS3

一、概念

1.什么是html5

2.什么是css3

3.w3c标准

4.前端学什么？

二、开发工具

三、html和css的语法

1.基本语法

1.1html的语法

1.2html的标签

1. 标签的基本结构

2. 标签的分类

1.3css的语法

1.4 入门代码

2.html种引入CSS样式

2.1 行内样式

2.2 内部样式表

2.3 外部样式表

3.CSS样式优先级

4.CSS基本选择器

4.1 标签选择器

语法：

案例：

4.2 类选择器

语法：

案例

4.3 ID选择器

语法：

案例：

4.4 优先级

5. CSS的高级选择器

5.1 层次选择器

5.2 结构伪类选择器

5.3 属性选择器

四、总结

相关文章：