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

6.前端--CSS-基础选择器【2023.11.26】

news 2026/4/6 11:11:34

1.CSS基本选择器

  1. 标签选择器：

标签选择器（元素选择器）是指用 HTML 标签名称作为选择器，按标签名称分类，为页面中某一类标签指定统一的 CSS 样式。标签选择器可以把某一类标签全部选择出来，比如所有的 <div> 标签和所有的 <span> 标签。

语法:

标签名{属性1: 属性值1; 属性2: 属性值2; 属性3: 属性值3; ...
}

举例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>p {color: aquamarine;}div {color: red;}</style>
</head>
<body><p>123345435</p><div>32414345235</div>
</body>
</html>

2.类选择器

如果想要差异化选择不同的标签，单独选一个或者某几个标签，可以使用类选择器.

语法

.类名 {属性1: 属性值1; ...
}

举例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.sec {color: aquamarine;}</style>
</head>
<body><p>123345435</p><p class="sec">222222222</p>
</body>
</html>

可以使用多类名调用 重要

<div class="pink fontWeight font20">亚瑟</div>
<div class="font20">刘备</div>
<div class="font14 pink">安其拉</div>
  1. id选择器

id 属性只能在每个 HTML 文档中出现一次。 只能调用一次, 别人切勿使用.

语法

#id名 {属性1: 属性值1; ...
}

举例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>#sec {color: aquamarine;}</style>
</head>
<body><p>123345435</p><p id="sec">222222222</p>
</body>
</html>
  1. 通配符选择器

在 CSS 中，通配符选择器使用“*”定义，它表示选取页面中所有元素（标签）。
通配符选择器不需要调用， 自动就给所有的元素使用样式

语法

* {属性1: 属性值1; ...
}

在这里插入图片描述

相关文章：

6.前端--CSS-基础选择器【2023.11.26】

1.CSS基本选择器 标签选择器&#xff1a; 标签选择器&#xff08;元素选择器&#xff09;是指用 HTML 标签名称作为选择器&#xff0c;按标签名称分类&#xff0c;为页面中某一类标签指定统一的 CSS 样式。标签选择器可以把某一类标签全部选择出来&#xff0c;比如所有的 <…...

编程日记 2023/11/28 7:30:48

Java制作“简易王者荣耀”小游戏

第一步是创建项目 项目名自拟 第二部创建个包名 来规范class 然后是创建类 GameFrame 运行类 package com.sxt;import java.awt.Graphics; import java.awt.Image; import java.awt.Toolkit; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; im…...

编程日记 2023/11/28 7:28:47

正则表达式例题-PTA

PTA-7-55 判断指定字符串是否合法-CSDN博客 7-54 StringBuffer-拼接字符串 题目&#xff1a; 输入3个整数n、begin、end。 将从0到n-1的数字拼接为字符串str。如&#xff0c;n12&#xff0c;则拼接出来的字符串为&#xff1a;01234567891011 最后截取字符串str从begin到end(包…...

编程日记 2023/11/28 7:27:46

基于Python的南京二手房数据可视化分析的设计与实现

点我完整下载&#xff1a;基于Python的南京二手房数据可视化分析的设计与实现.docx 基于Python的南京二手房数据可视化分析的设计与实现 "Design and Implementation of Python-based Visualization Analysis for Nanjings Second-hand Housing Data" 目录 目录 2 摘…...

编程日记 2023/11/28 7:26:43

软件特征与类型

软件包括计算机系统中的程序和文档&#xff0c;它是一组能完成特定任务的二进制代码。 ▶1.软件的特性 1)软件是一种逻辑元素 软件是逻辑的而非物理的元素&#xff1b;软件是设计开发的&#xff0c;而不是生产制造的。虽然软件开发和硬件制造存在某些相似点&#xff0c;但二…...

编程日记 2023/11/28 7:25:43

无人机遥控器方案定制_MTK平台无人设备手持遥控终端PCB板开发

随着科技的不断发展和无人机技术的逐步成熟&#xff0c;无人机越来越受到人们的关注。作为一种高新技术&#xff0c;无人机的应用范围不断拓展&#xff0c;包括农业、环境监测、城市规划、运输物流等领域。同时&#xff0c;无人机的飞行控制技术也得到了不断的优化和提升。 早…...

编程日记 2023/11/28 7:24:41

【C++】静态成员

静态成员就是在成员变量和成员函数前加上关键字static&#xff0c;称为静态成员。 静态成员分为&#xff1a; 静态成员变量 所有对象共享同一份数据在编译阶段分配内存类内声明&#xff0c;类外初始化 静态成员函数 所有对象共享同一个函数静态成员函数只能访问静态成员变量 …...

编程日记 2023/11/28 7:23:41

单片机学习10——独立按键

独立按键输入检测&#xff1a; #include<reg52.h>sbit LED1P1^0; sbit KEY1P3^4;void main() {KEY11;while(1){if(KEY10) //KEY1按下{LED10; //LED1被点亮}else{LED11;}} } 按键 #include<reg52.h>#define uchar unsigned char #define uint unsigned intsbit …...

编程日记 2023/11/28 7:22:40

微服务系列（三）--通过spring cloud zuul过滤器实现线上流量复制

思路 补充一下&#xff0c;为什么这里我会想到使用"pre"类型的过滤器实现流量复制/流量镜像。 刚开始的时候&#xff0c;参考了阿里的流量镜像实现方案&#xff1a; 配置流量复制策略&#xff0c;阿里的方案本身是对基于云原生envoy做的&#xff0c;这确实是istio原…...

编程日记 2023/11/28 7:21:38

微信小程序image组件图片设置最大宽度 宽高自适应

问题描述&#xff1a;在使用微信小程序image组件的时候&#xff0c;在不确定图片宽高情况下 想给一个最大宽度让图片自适应&#xff0c;按比例&#xff0c;image的widthfiex和heightFiex并不能满足&#xff08;只指定最大宽/高并不会生效&#xff09; 问题解决&#xff1a;使用…...

编程日记 2023/11/28 7:18:35

虚幻学习笔记—文本内容处理

一、前言 本文使用的虚幻引擎5.3.2&#xff0c;在虚幻中已经集成了很多可以直接处理多样化文本的蓝图&#xff0c;比如格式化动态显示、浮点数多样化等。 二、实现 2.1、格式化文本显示动态内容&#xff1a;在设置某个文本时可以使用“Format Text”蓝图设置自定义可以的显示…...

编程日记 2023/11/28 7:17:34

WhatsApp API号解封教程（内含图片指引和申诉模板）

WhatsApp API 是专门为中大型企业设置的WhatsApp APP页面&#xff0c;API号并不像WhatsApp个人号和企业号一样可以直接从App Store 或Google Play 下载&#xff0c;而是需要对接官方来连接API。 虽然申请WhatsApp API号的程序和手续比较复杂&#xff0c;但是这个操作对于企业来…...

编程日记 2023/11/28 7:16:33

爬取极简壁纸

js反编译的代码需要解密之类的&#xff0c;直接给我干蒙圈了&#xff0c;借助selenium可以直接获取到调式工具中的源码&#xff0c;可以获取渲染后的链接&#xff0c;然后将链接交给下载函数&#xff08;使用异步提高效率&#xff09;即可。 后续学习完js反编译的话&#xff0…...

编程日记 2023/11/28 7:15:30

docker操作手册

写在前面的几个重要命令 docker与本地件的文件拷贝 # 查看容器ID docker ps -a# 本地文件拷本到容器 docker cp {local_path} {CONTAINER ID}:{path}# 容器拷本到本地 docker cp {CONTAINER ID}:{path} {local_path} # eg docker cp /Users/helloworld/Downloads/R-3.5.0 0a1…...

编程日记 2023/11/28 7:14:29

css Vue尺子样式

原生css生成尺子样式 <template><div class"page"><div class"Light"></div><div class"rile"><ul id"list"><!--尺子需要几个单位就加几个--><li></li><li></li&…...

编程日记 2023/11/28 7:13:29

C++ 数据结构之-最小栈（MinStack）

最小栈 最小栈&#xff08;Min Stack&#xff09;是一个支持常数时间复杂度获取栈中最小元素的特殊栈数据结构。通常&#xff0c;标准的栈数据结构只支持在常数时间内执行入栈&#xff08;push&#xff09;和出栈&#xff08;pop&#xff09;操作&#xff0c;但无法在常数时间内…...

编程日记 2023/11/28 7:12:28

【日常总结】优雅升级Swagger 2 升至 3.0, 全局设置 content-type application/json

目录 一、场景 二、问题 三、解决方案 四、延伸 上一节&#xff1a;【日常总结】Swagger-ui 导入 showdoc &#xff08;优雅升级Swagger 2 升至 3.0&#xff09;-CSDN博客 一、场景 接上一节&#xff1a;在 Swagger3Config extends WebMvcConfigurationSupport&#xff0c…...

编程日记 2023/11/28 7:11:27

2023.11.27如何使用内网穿透工具实现Java远程连接操作本地Elasticsearch搜索引擎

文章目录 前言1. Windows 安装 Cpolar2. 创建Elasticsearch公网连接地址3. 远程连接Elasticsearch4. 设置固定二级子域名 前言 简单几步,结合Cpolar内网穿透工具实现Java远程连接操作本地Elasticsearch。 什么是elasticsearch&#xff1f;一个开源的分布式搜索引擎&#xff0…...

编程日记 2023/11/28 7:10:26

HNU 练习八 结构体编程题1. 评委打分

【问题描述】 校园卡拉OK比赛设置了7名评委&#xff0c;当一名选手K完歌之后&#xff0c;主持人报出歌手名字后&#xff0c;7位评委同时亮分&#xff0c;按照惯例&#xff0c;去掉一个最高分和一个最低分后&#xff0c;其余5位评委评分总和为该选手的最终得分。 一共有n组选手参…...

编程日记 2023/11/28 7:09:25

数据结构：字典树（前缀树，Trie树），压缩字典树（Radix）

字典树Trie Tree 字典树也称前缀树&#xff0c;Trie树。在 Elasticsearch 的倒排索引中用的也是 Trie 树。是一种针对字符串进行维护的数据结构。 字典树是对词典的一种存储方式&#xff0c;这个词典中的每个“单词”就是从根节点出发一直到某一个目标节点的路径&#xff0c;…...

编程日记 2023/11/28 7:08:24

tts-vue本地语音合成解决方案：从技术原理到生产实践

tts-vue本地语音合成解决方案&#xff1a;从技术原理到生产实践 【免费下载链接】tts-vue &#x1f3a4; 微软语音合成工具&#xff0c;使用 Electron Vue ElementPlus Vite 构建。 项目地址: https://gitcode.com/gh_mirrors/tt/tts-vue 一、破解本地化语音合成的技…...

编程新知 2026/4/6 10:12:27

BaiduPCS-Web：智能突破百度网盘限速的革命性解决方案

BaiduPCS-Web&#xff1a;智能突破百度网盘限速的革命性解决方案 【免费下载链接】baidupcs-web 项目地址: https://gitcode.com/gh_mirrors/ba/baidupcs-web 还在为百度网盘的下载速度而烦恼吗&#xff1f;当急需下载重要文件时&#xff0c;几十KB/s的速度是否让你感到…...

编程新知 2026/4/6 9:46:01

Go JSON 编解码性能优化技巧

Go语言因其高效的并发模型和简洁的语法广受开发者喜爱&#xff0c;但在处理JSON编解码时&#xff0c;性能问题常成为瓶颈。随着微服务和高并发场景的普及&#xff0c;优化JSON处理效率变得尤为重要。本文将分享几个实用的Go JSON编解码性能优化技巧&#xff0c;帮助开发者提升应…...

编程新知 2026/4/6 9:46:01

Qwen3.5-35B-AWQ-4bit效果展示：建筑设计草图→功能分区→材料标注→预算估算联动

Qwen3.5-35B-AWQ-4bit效果展示&#xff1a;建筑设计草图→功能分区→材料标注→预算估算联动 1. 模型能力概览 Qwen3.5-35B-AWQ-4bit是一款专为视觉多模态理解设计的量化模型&#xff0c;在建筑设计领域展现出惊人的实用价值。这个模型能够&#xff1a; 准确识别建筑草图中的…...

编程新知 2026/4/6 8:00:34

S2-Pro低代码平台集成：为业务人员赋能AI能力

S2-Pro低代码平台集成&#xff1a;为业务人员赋能AI能力 1. 低代码遇上AI&#xff1a;业务创新的新机遇 想象一下&#xff0c;市场部的同事小李需要快速搭建一个智能客服系统来处理客户咨询。传统方式下&#xff0c;他需要找IT部门排期&#xff0c;等待开发团队写代码、调试模…...

编程新知 2026/4/6 7:16:02

Z-Image-GGUF文生图模型问题解决：常见报错处理，让AI绘画更顺畅

Z-Image-GGUF文生图模型问题解决&#xff1a;常见报错处理&#xff0c;让AI绘画更顺畅 1. 引言 在使用Z-Image-GGUF文生图模型进行AI绘画创作时&#xff0c;许多用户可能会遇到各种技术问题和报错信息。本文将全面梳理最常见的报错情况及其解决方案&#xff0c;帮助您快速定位…...

编程新知 2026/4/6 7:03:51

基础入门-版本控制-GitLab/Gitea 基本使用

GitLab/Gitea 基本使用 在前面的章节中，我们学习了 Git 基础命令和团队协作流程。在实际工作中，这些操作都是围绕着代码托管平台展开的。GitLab 和 Gitea 是两种广泛使用的自托管 Git 仓库管理工具，它们提供了仓库管理、权限控制、代码审查、CI/CD 等功能，是运维团队进行配…...

编程新知 2026/4/6 5:54:29

ADG实时同步失效的深层原因：从MRP0的WAIT_FOR_LOG状态看standby redolog设计要点

ADG实时同步失效的深层解析&#xff1a;从WAIT_FOR_LOG状态看SRL设计关键点 当Oracle Data Guard环境中MRP0进程陷入WAIT_FOR_LOG状态时&#xff0c;这就像高速公路上的应急车道被占用——整个容灾系统的实时同步能力将陷入瘫痪。本文将带您穿透现象看本质&#xff0c;从存储结…...

编程新知 2026/4/6 5:34:20

H5游戏整合平台源码：70款游戏一键搭建，支持流量主变现的完整解决方案

一、平台概述与核心优势这套H5游戏整合平台源码是一套全面、实用且零门槛的一站式解决方案。它专为站长、开发者、创业团队及游戏爱好者打造&#xff0c;无需分散搜罗各类零散源码&#xff0c;一次获取即可拥有70余款经典H5网页小游戏。所有源码均基于原生H5技术开发&#xff0…...

编程新知 2026/4/6 5:14:14

CentOS7下CDP7.1.1集群部署全攻略：从系统调优到MySQL配置避坑指南

CentOS7企业级CDP7.1.1集群深度部署指南&#xff1a;系统调优与MySQL高可用实战 开篇&#xff1a;企业级大数据平台的基石构建 当数据量突破TB级门槛时&#xff0c;一个经过深度优化的集群环境直接决定了数据分析的效率和稳定性。我曾亲历过某金融客户由于透明大页未关闭导致集…...

编程新知 2026/4/6 4:18:40