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

CSS基础语法第二天

news 2026/3/27 22:05:56

目录

一、复合选择器

1.1 后代选择器

1.2 子代选择器

1.3 并集选择器

1.4 交集选择器

1.4.1超链接伪类

二、CSS特性

2.1 继承性

2.2 层叠性

2.3 优先级

基础选择器

复合选择器-叠加

三、Emmet 写法

3.1HTML标签

3.2CSS

四、背景属性

4.1 背景图

4.2 平铺方式

4.3 背景图位置

4.4 背景图缩放

4.5 背景图固定

4.6 背景复合属性

五、显示模式

5.1 块级元素

5.2 行内元素

5.3 行内块元素

5.4 转换显示模式

六、综合案例

6.1 热词

6.2 banner 效果

一、复合选择器

定义：由两个或多个基础选择器，通过不同的方式组合而成。

作用：更准确、更高效的选择目标元素（标签）。

1.1 后代选择器

后代选择器：选中某元素的后代元素。

选择器写法：父选择器 子选择器 { CSS 属性}，父子选择器之间用空格隔开。

<!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 span {color: red;}</style>
</head><body><span>这是一个普通biaoqian</span><div><span>这是div的儿子</span><p><span>这是孙子</span></p></div>
</body></html>

1.2 子代选择器

子代选择器：选中某元素的子代元素（最近的子级

相关文章：

CSS基础语法第二天

目录 一、复合选择器 1.1 后代选择器 1.2 子代选择器 1.3 并集选择器 1.4 交集选择器 1.4.1超链接伪类 二、CSS特性 2.1 继承性 2.2 层叠性 2.3 优先级 基础选择器 复合选择器-叠加 三、Emmet 写法 3.1HTML标签 3.2CSS 四、背景属性 4.1 背景图 4.2 平铺方式 …...

编程日记 2023/10/2 23:56:55

ThreeJS - 封装一个GLB模型展示组件（TypeScript）

一、引言 最近基于Three.JS&#xff0c;使用class封装了一个GLB模型展示&#xff0c;支持TypeScript、支持不同框架使用&#xff0c;具有多种功能。 &#xff08;下图展示一些基础的功能&#xff0c;可以自行扩展&#xff0c;比如光源等&#xff09; 二、主要代码 本模块依赖…...

编程日记 2023/10/2 23:55:55

HashMap面试题

1.hashMap底层实现 hashMap的实现我们是要分jdk 1.7及以下版本&#xff0c;jdk1.8及以上版本 jdk 1.7 实现是用数组链表 jdk1.8 实现是用数组链表红黑树&#xff0c; 链表长度大于8&#xff08;TREEIFY_THRESHOLD&#xff09;时&#xff0c;会把链表转换为红黑树&#xff0c…...

编程日记 2023/10/2 23:53:53

Java编程技巧：swagger2、knif4j集成SpringBoot或者SpringCloud项目

目录 1、springbootswagger2knif4j2、springbootswagger3knif4j3、springcloudswagger2knif4j 1、springbootswagger2knif4j 2、springbootswagger3knif4j 3、springcloudswagger2knif4j 注意点&#xff1a; Api注解&#xff1a;Controller类上的Api注解需要添加tags属性&a…...

编程日记 2023/10/2 23:52:52

第三章：最新版零基础学习 PYTHON 教程（第九节 - Python 运算符—Python 中的除法运算符）

除法运算符允许您将两个数字相除并返回商，即，第一个数字或左侧的数字除以第二个数字或右侧的数字并返回商。 Python 中的除法运算符 除法运算符有两种类型： 浮点数除法整数除法（向下取整除法）整数相除时，结果四舍五入为最接近的整数，并用符号“//”表示。浮点数“/”…...

编程日记 2023/10/2 23:50:50

【python】导出mysql数据，输出excel！

参考https://blog.csdn.net/pengneng123/article/details/131111713 import pymysql import pandas as pd #import openpyxl import xlsxwriterdb pymysql.connect(host"10.41.241.114", port***,user***,password***,charsetutf8mb4 )cursor db.cursor() #创建游…...

编程日记 2023/10/2 23:47:48

【Java 进阶篇】JDBC ResultSet 遍历结果集详解

在Java数据库编程中&#xff0c;经常需要执行SQL查询并处理查询结果。ResultSet&#xff08;结果集&#xff09;是Java JDBC中用于表示查询结果的关键类之一。通过遍历ResultSet&#xff0c;我们可以访问和操作从数据库中检索的数据。本文将详细介绍如何使用JDBC来遍历ResultSe…...

编程日记 2023/10/2 23:45:46

华为数通方向HCIP-DataCom H12-831题库(单选题：161-180）

第161题 某台路由器Router LSA如图所示，下列说法中错误的是? A、本路由器已建立邻接关系 B、本路由器为DR C、本路由支持外部路由引入 D、本路由器的Router ID为10.0.12.1 答案： B 解析： 一类LSA的在transnet网络中link id值为DR的route id ,但Link id的地址不是10.0.12.…...

编程日记 2023/10/2 23:44:45

【VsCode】SSH远程连接Linux服务器开发，搭配cpolar内网穿透实现公网访问

文章目录 前言1、安装OpenSSH2、vscode配置ssh3. 局域网测试连接远程服务器4. 公网远程连接4.1 ubuntu安装cpolar内网穿透4.2 创建隧道映射4.3 测试公网远程连接 5. 配置固定TCP端口地址5.1 保留一个固定TCP端口地址5.2 配置固定TCP端口地址5.3 测试固定公网地址远程 前言 远程…...

编程日记 2023/10/2 23:41:42

java并发编程 守护线程 用户线程 main

经常使用线程&#xff0c;没有对守护线程和用户线程的区别做彻底了解 下面写4个例子来验证一下 源码如下 /* Whether or not the thread is a daemon thread. */ private boolean daemon false;/*** Marks this thread as either a {linkplain #isDaemon daemon} thread*…...

编程日记 2023/10/2 23:39:41

wxWidgets（1）：在Ubuntu 环境中搭建wxWidgets 库环境，安装库和CodeBlocks的IDE，可以运行demo界面了，继续学习中

1&#xff0c;选择使用 wxWidgets 框架 选择这个主要是因为完全的开源&#xff0c;不想折腾 Qt的库&#xff0c;而且打包的文件比较大。 网络上面有很多的对比&#xff0c;而且使用QT的人比较多。 但是我觉得wxwidgets 更加偏向 c 语法本身&#xff0c;也有助学习C。 没有太多…...

编程日记 2023/10/2 23:37:39

[VIM]VIM初步学习-3

3-1 编写 vim 配置&#xff0c;我的 vim 我做主_哔哩哔哩_bilibili...

编程日记 2023/10/2 23:36:38

RocketMQ Dashboard说解

RocketMQ Dashboard 是 RocketMQ 的管控利器&#xff0c;为用户提供客户端和应用程序的各种事件、性能的统计信息&#xff0c;支持以可视化工具代替 Topic 配置、Broker 管理等命令行操作。 介绍​ 功能概览​ 面板功能运维修改nameserver 地址; 选用 VIPChannel驾驶舱查看 …...

编程日记 2023/10/2 23:35:37

【RabbitMQ实战】05 RabbitMQ后台管理

一、多租户与权限 1.1 vhost的概念 每一个 RabbitMQ服务器都能创建虚拟的消息服务器&#xff0c;我们称之为虚拟主机(virtual host),简称为 vhost。每一个 vhost本质上是一个独立的小型RabbitMQ服务器&#xff0c;拥有自己独立的队列、交换器及绑定关系等&#xff0c;并且它拥…...

编程日记 2023/10/2 23:33:35

PHP8中final关键字的应用-PHP8知识详解

在PHP8中&#xff0c;final的中文含义是最终的、最后的意思。被final修饰过的类和方法就是“最终的版本”。 如果关键字final放在类的前面&#xff0c;则表示该类不能被继承。 如果关键字final放在方法的前面&#xff0c;则表示该 方法不能被重新定义。 如果有一个类的格式为…...

编程日记 2023/10/2 23:28:28

基于Java的校园失物招领平台设计与实现(源码+lw+部署文档+讲解等)

文章目录 前言具体实现截图论文参考详细视频演示为什么选择我自己的网站自己的小程序&#xff08;小蔡coding&#xff09;有保障的售后福利 代码参考源码获取 前言 &#x1f497;博主介绍&#xff1a;✌全网粉丝10W,CSDN特邀作者、博客专家、CSDN新星计划导师、全栈领域优质创作…...

编程日记 2023/10/2 23:26:25

〔024〕Stable Diffusion 之 模型训练 篇

✨ 目录 🎈 训练集准备🎈 训练集预处理🎈 数据清洗🎈 下载训练源码🎈 训练文件配置🎈 脚本运行🎈 实战测试🎈 训练集准备 声明： 该文中所涉及到的女神图片均来自于网络，仅用作技术教程演示，图片已码一般同一个训练集需要准备 20~40 张不同角度的照片，当然可…...

编程日记 2023/10/2 23:25:24

【MySQL入门到精通-黑马程序员】MySQL基础篇-DML

文章目录 前言一、DML-介绍二、DML-添加数据三、DML-修改数据四、DML-删除数据总结 前言 本专栏文章为观看黑马程序员《MySQL入门到精通》所做笔记&#xff0c;课程地址在这。如有侵权&#xff0c;立即删除。 一、DML-介绍 DML&#xff08;Data Manipulation Language&#xf…...

编程日记 2023/10/2 23:24:23

【ARMv8 SIMD和浮点指令编程】NEON 加载指令——如何将数据从内存搬到寄存器（LDxLDxR）？

将内存中的数据搬到 NEON 寄存器，有很多指令可以完成，熟悉这些指令是必须的。 1 LD1 (multiple structures) 将多个单元素结构加载到一个，两个，三个或四个寄存器上。该指令从内存中加载多个单元结构，并将结果写入一、二、三或四个 SIMD&FP 寄存器。 无偏移 一个寄存…...

编程日记 2023/10/2 23:20:19

华为云云耀云服务器L实例评测 ｜ 实例场景体验之搭建个人博客：通过华为云云耀云服务器构建个人博客

华为云云耀云服务器L实例评测 &#xff5c; 实例场景体验之搭建个人博客&#xff1a;通过华为云云耀云服务器构建个人博客 介绍华为云云耀云服务器 华为云云耀云服务器 &#xff08;目前已经全新升级为 华为云云耀云服务器L实例&#xff09; 华为云云耀云服务器是什么华为云云耀…...

编程日记 2023/10/2 23:15:15

中兴光猫配置解密工具：轻松破解网络限制，完全掌控家庭网络

中兴光猫配置解密工具&#xff1a;轻松破解网络限制&#xff0c;完全掌控家庭网络 【免费下载链接】ZET-Optical-Network-Terminal-Decoder 项目地址: https://gitcode.com/gh_mirrors/ze/ZET-Optical-Network-Terminal-Decoder 你是否遇到过想要修改光猫设置却找不到入…...

编程新知 2026/3/27 21:17:47

SLAM Toolbox应用宝典：从技术原理到实战落地的全面指南

SLAM Toolbox应用宝典&#xff1a;从技术原理到实战落地的全面指南 【免费下载链接】slam_toolbox Slam Toolbox for lifelong mapping and localization in potentially massive maps with ROS 项目地址: https://gitcode.com/gh_mirrors/sl/slam_toolbox SLAM Toolbox…...

编程新知 2026/3/27 20:01:05

[特殊字符]空间智能目标追踪系统：从“看视频”到“掌控空间”的技术跃迁——多模态识别 × 空间建模 × 轨迹预测，让视频系统具备“感知与决策能力”[特殊字符] 视频系统的终极形态，不是记录世

&#x1f6a8;空间智能目标追踪系统&#xff1a;从“看视频”到“掌控空间”的技术跃迁——多模态识别 空间建模 轨迹预测&#xff0c;让视频系统具备“感知与决策能力”&#x1f4a5; 视频系统的终极形态&#xff0c;不是记录世界&#xff0c;而是理解世界。一、系统定位&am…...

编程新知 2026/3/27 19:53:03

ROS2新手必看：用turtlesim小乌龟快速入门机器人仿真（附完整安装指南）

ROS2实战入门&#xff1a;从turtlesim小乌龟探索机器人仿真世界 引言&#xff1a;为什么选择turtlesim作为ROS2的起点&#xff1f; 在机器人操作系统(ROS)的学习道路上&#xff0c;很多开发者都会遇到一个共同的困境&#xff1a;理论概念抽象难懂&#xff0c;而直接上手复杂项…...

编程新知 2026/3/27 18:06:06

ai辅助开发：让快马生成智能助手，链接notepad下载与个性化代码推荐

今天想和大家分享一个有趣的实践&#xff1a;如何用AI辅助开发的方式&#xff0c;让Notepad这个老牌文本编辑器焕发新生。我们平时下载Notepad可能只是简单获取软件&#xff0c;但如果结合AI能力&#xff0c;就能把"下载-使用"的流程升级成"智能助手"体验。…...

编程新知 2026/3/27 17:25:57

C++ sort函数进阶指南：如何优雅地自定义结构体排序规则

C sort函数进阶指南&#xff1a;如何优雅地自定义结构体排序规则 在C开发中&#xff0c;数据排序是一个永恒的话题。当我们需要处理复杂数据结构时&#xff0c;标准库提供的默认排序方式往往无法满足需求。这时&#xff0c;掌握sort函数的高级用法就显得尤为重要。本文将深入探…...

编程新知 2026/3/27 15:04:50

告别C盘爆炸！手把手教你将Dify+Docker数据盘迁移到D盘（附.ENV配置详解）

告别C盘爆炸&#xff01;手把手教你将DifyDocker数据盘迁移到D盘&#xff08;附.ENV配置详解&#xff09; Windows系统盘空间告急是许多开发者的共同烦恼&#xff0c;尤其是当你开始使用Docker部署AI开发环境时。C盘空间像被黑洞吞噬一样迅速消失&#xff0c;系统运行速度也随之…...

编程新知 2026/3/27 14:36:33

OpenClaw多任务调度：GLM-4.7-Flash并行处理文件与邮件

OpenClaw多任务调度&#xff1a;GLM-4.7-Flash并行处理文件与邮件 1. 为什么需要多任务调度 上周我需要同时处理两个紧急任务&#xff1a;整理三个月积累的会议录音文字稿&#xff0c;以及给二十多位合作伙伴发送定制化跟进邮件。手动操作需要至少6小时&#xff0c;而第二天早…...

编程新知 2026/3/27 14:20:23

从Buck到三电平：软开关DC-DC变换器的Simulink建模与双闭环控制仿真

1. 从Buck到三电平&#xff1a;电力电子技术的进化之路 记得我第一次接触DC-DC变换器时&#xff0c;Buck电路就像是一道必须跨过的门槛。这个经典的降压电路结构简单&#xff0c;却蕴含着电力电子最基础的设计思想。但随着项目需求的提升&#xff0c;传统Buck电路在高压大功率场…...

编程新知 2026/3/27 14:03:28

Deepfake Offensive Toolkit实战：视频会议系统渗透测试案例

Deepfake Offensive Toolkit实战&#xff1a;视频会议系统渗透测试案例 【免费下载链接】dot The Deepfake Offensive Toolkit 项目地址: https://gitcode.com/gh_mirrors/dot/dot 想要了解如何利用深度伪造技术进行视频会议系统安全测试吗&#xff1f;Deepfake Offensi…...

编程新知 2026/3/27 13:37:11