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

属性选择器

news 2026/2/10 22:31:08

1.[title]{background:yellow;}：所有带title标签设置成黄色    

2.div[class]{background:yellow;}：所有div中带class标签设置成黄色    

3.div[class=box1]{border:1px solid blue; }：div中包含class并且class=box1的设置成蓝边框

4. class^=b 以b开头的[title^=ab]{background-color: yellow;}，设置背景色黄色
    class$=b 以b结尾
    class*=b 包含b 

5.div[class~=box1]{border:1px solid blue;}，只要class里面包含box1的设置成蓝边框

<!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>/* 属性选择器 [class,,] */div[class]{background:yellow;}p[class]{background:red;}/* div .box1 {} *//* 完全匹配 *//* div[class=box1]{border:1px solid blue;} *//* 包含就匹配 */div[class~=box1]{border:1px solid blue;}input[name]{background:yellow;}input[type=email]{background:red;}/* 模糊匹配class^=b 以这个开头的class$=b 以这个结尾class*=b 包含某个字符 */div[class*="1"],p[class*="1"]{color:green;}</style>
</head>
<body><div class="box1">div-11111</div><div class="box2">div-22222</div><div >div-33333</div><div class="box1">div-44444</div><div class="box1 box3">div-555555555555555</div><p class="p1">p-11111</p><p class="p2">p-22222</p><p >p-33333</p><div><h1>注册页面</h1>用户名：<input type="text" name="username"> <br>密码：<input type="password" name="password"><br>年龄<input type="number" name="age"><br>邮箱<input type="email"><br></div>
</body>
</html>

相关文章：

属性选择器

1.[title]{background:yellow;}&#xff1a;所有带title标签设置成黄色 2.div[class]{background:yellow;}&#xff1a;所有div中带class标签设置成黄色 3.div[classbox1]{border:1px solid blue; }&#xff1a;div中包含class并且classbox1的设置成蓝边框 4. class…...

编程日记 2024/4/1 4:33:06

软考 - 系统架构设计师 - 关系模型的完整性规则

前言 关系模型的完整性规则是一组用于确保关系数据库中数据的完整性和一致性的规则。这些规则定义了在关系数据库中如何存储、更新和查询数据&#xff0c;以保证数据的准确性和一致性。 详情 关系模型的完整性规则主要包括以下三类&#xff1a; 实体完整性规则 这是确保每个…...

编程日记 2024/4/1 4:31:03

写了几个难一点的sql

写了几个难一点的sql SELECT bn.id AS book_node_id, t.version_id, bn.textbook_id, s.id AS subject_id, s.stage_id, COUNT( CASE WHEN d.document_type_id 1 AND d.scope IS NULL AND p.document_id IS NOT NULL THEN 1 END ) AS type_1_count, COUNT( CASEWHEN d.docume…...

编程日记 2024/4/1 4:30:01

【JDK常用的API】包装类

&#x1f36c; 博主介绍&#x1f468;‍&#x1f393; 博主介绍&#xff1a;大家好&#xff0c;我是 hacker-routing &#xff0c;很高兴认识大家~ ✨主攻领域&#xff1a;【渗透领域】【应急响应】 【Java】 【VulnHub靶场复现】【面试分析】 &#x1f389;点赞➕评论➕收藏 …...

编程日记 2024/4/1 4:29:00

Android Q（10）黑暗模式适配的实现

一、引言 随着 AndroidQ&#xff08;10&#xff09;的发布&#xff0c;黑暗模式成为了系统级别的特性。为了满足用户在不同环境下的使用需求&#xff0c;应用程序需要及时进行黑暗模式的适配。本文将详细介绍如何在 AndroidQ&#xff08;10&#xff09;上实现黑暗模式的适配&a…...

编程日记 2024/4/1 4:28:00

【git】git使用手册

目录 一 初始化 1.1 账号配置 1.2 ssh生成 1.2.1 配置ssh 1.2.2 测试SSH 1.3 初始化本地仓库并关联远程仓库 二 使用 2.1 上传 2.2 拉取 三 问题 3.1 关联失败 一 初始化 git的安装很简单,下载后大部分进行下一步完成即可----->地址: git工具下载 1.1 账号配置…...

编程日记 2024/4/1 4:24:57

unity中判断方向 用 KeyVertical ，KeyHorizontal 判断ui物体的 方向

float KeyVertical Input.GetAxis("Vertical"); float KeyHorizontal Input.GetAxis("Horizontal"); // 假设 UI 物体在竖直方向上为 Y 轴&#xff0c;水平方向上为 X 轴 Vector2 direction new Vector2(KeyHorizontal, KeyVertical); if (direction…...

编程日记 2024/4/1 4:19:52

前端a4纸尺寸转像素尺寸

前端必备工具推荐网站(免费图床、API和ChatAI等实用工具): http://luckycola.com.cn/ 一、a4纸张有多大 A4纸的尺寸是210mm297mm,也就是21.0cm29.7cm, A4纸尺寸转屏幕像素尺寸和屏幕分辨率有关,首先1英寸2.54cm, 如果屏幕DPI分辨率为72像素/英寸&#xff0c;换算一下&#xff…...

编程日记 2024/4/1 4:16:50

Android 中 调试和减少内存错误

Android 中 调试和减少内存错误 ASan 概述 官网连接&#xff1a; https://developer.android.com/ndk/guides/asan?hlzh-cn ASan API 27开始HWASan&#xff08;替换AScan&#xff09; 从 NDK r21 和 Android 10&#xff08;API 级别 29&#xff09;开始适用于 64 位 Arm 设…...

编程日记 2024/4/1 4:14:47

证券市场概述

证券市场 证券市场参与者证券发行市场&#xff08;一级市场&#xff09;证券发行方式&#xff08;按发行对象&#xff09;证券发行方式&#xff08;按有无中介&#xff09;证券交易市场&#xff08;二级市场&#xff09;证券交易所场外交易市场&#xff08;店头市场、柜台市场&…...

编程日记 2024/4/1 4:11:44

什么是数据结构

一、什么是数据结构 1.数据结构研究计算机数据间的关系 2.包括数据的逻辑结构和储存结构及其操作 数据的逻辑结构&#xff1a;表示数据运算之间的抽象关系 按每个元素可能具有的直接前趋数和后继数将逻辑结构分为“线性结构”和“非线性结构”两大类 数据的储存结构&#…...

编程日记 2024/4/1 4:10:43

基于springboot+vue实现的学校田径运动会管理系统

作者主页&#xff1a;Java码库 主营内容&#xff1a;SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、小程序、安卓app等设计与开发。 收藏点赞不迷路 关注作者有好处 文末获取源码 技术选型 【后端】&#xff1a;Java 【框架】&#xff1a;spring…...

编程日记 2024/4/1 4:02:34

HarmonyOS 应用开发之FA模型绑定Stage模型ServiceExtensionAbility

本文介绍FA模型的三种应用组件如何绑定Stage模型的ServiceExtensionAbility组件。 PageAbility关联访问ServiceExtensionAbility PageAbility关联访问ServiceExtensionAbility和PageAbility关联访问ServiceAbility的方式完全相同。 import featureAbility from ohos.ability…...

编程日记 2024/4/1 4:01:33

Java 中的单例模式

引言&#xff1a; 在 Java 编程中&#xff0c;单例模式是一种常见的设计模式&#xff0c;它保证一个类只能创建一个实例&#xff0c;并提供一个全局访问点。单例模式在很多场景下都非常有用&#xff0c;比如线程池、日志系统、数据库连接池等。本文将详细介绍 Java 中单例模式的…...

编程日记 2024/4/1 4:00:32

鸿蒙OS开发实例：【ArkTS类库多线程I/O密集型任务开发】

使用异步并发可以解决单次I/O任务阻塞的问题&#xff0c;但是如果遇到I/O密集型任务&#xff0c;同样会阻塞线程中其它任务的执行&#xff0c;这时需要使用多线程并发能力来进行解决。 I/O密集型任务的性能重点通常不在于CPU的处理能力&#xff0c;而在于I/O操作的速度和效率。…...

编程日记 2024/4/1 3:59:31

OpenStack部署

目录 一、安装环境 1.无网络使用该命令 2.修改主机名 3.配置hosts解析 4.配置本机免密 5.关闭防火墙和SElinux策略 6.关闭NewworkManager 7.修改yum源 7.1下载阿里源 7.2清空并加载缓存yum源 8.安装基本工具 9.系统升级 10.安装OPenStack的yum仓库 11.修改OPenSt…...

编程日记 2024/4/1 3:57:29

Java中的多线程和线程安全问题

线程 线程是操作系统进行调度的最小单位。一个进程至少包含一个主线程&#xff0c;而一个线程可以启动多个子线程。线程之间共享进程的资源&#xff0c;但也有自己的局部变量。多线程程序和普通程序的区别&#xff1a;每个线程都是一个独立的执行流&#xff1b;多个线程之间是…...

编程日记 2024/4/1 3:53:23

java Web会议信息管理系统 用eclipse定制开发mysql数据库BS模式java编程jdbc

一、源码特点 jsp 会议信息管理系统是一套完善的web设计系统&#xff0c;对理解JSP java SERLVET mvc编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,eclipse开发&#xff0c;数据库为Mysql5.0&am…...

编程日记 2024/4/1 3:50:21

lock4j学习记录

一种简单的&#xff0c;支持不同方案的高性能分布式锁 简介 lock4j是一个分布式锁组件&#xff0c;其提供了多种不同的支持以满足不同性能和环境的需求。 立志打造一个简单但富有内涵的分布式锁组件。 特性 简单易用&#xff0c;功能强大&#xff0c;扩展性强。支持redis…...

编程日记 2024/4/1 3:46:16

【C++庖丁解牛】自平衡二叉搜索树--AVL树

&#x1f341;你好&#xff0c;我是 RO-BERRY &#x1f4d7; 致力于C、C、数据结构、TCP/IP、数据库等等一系列知识 &#x1f384;感谢你的陪伴与支持 &#xff0c;故事既有了开头&#xff0c;就要画上一个完美的句号&#xff0c;让我们一起加油 目录 前言1 AVL树的概念2. AVL…...

编程日记 2024/4/1 3:45:15

ubuntu搭建nfs服务centos挂载访问

在Ubuntu上设置NFS服务器 在Ubuntu上&#xff0c;你可以使用apt包管理器来安装NFS服务器。打开终端并运行&#xff1a; sudo apt update sudo apt install nfs-kernel-server创建共享目录 创建一个目录用于共享&#xff0c;例如/shared&#xff1a; sudo mkdir /shared sud…...

编程新知 2026/2/6 23:18:59

使用 SymPy 进行向量和矩阵的高级操作

在科学计算和工程领域&#xff0c;向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能&#xff0c;能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作&#xff0c;并通过具体…...

编程新知 2026/2/8 21:52:30

AI，如何重构理解、匹配与决策？

AI 时代&#xff0c;我们如何理解消费&#xff1f; 作者&#xff5c;王彬 封面&#xff5c;Unplash 人们通过信息理解世界。 曾几何时&#xff0c;PC 与移动互联网重塑了人们的购物路径&#xff1a;信息变得唾手可得&#xff0c;商品决策变得高度依赖内容。 但 AI 时代的来…...

编程新知 2026/1/30 2:33:11

GitFlow 工作模式（详解）

今天再学项目的过程中遇到使用gitflow模式管理代码&#xff0c;因此进行学习并且发布关于gitflow的一些思考 Git与GitFlow模式 我们在写代码的时候通常会进行网上保存&#xff0c;无论是github还是gittee&#xff0c;都是一种基于git去保存代码的形式&#xff0c;这样保存代码…...

编程新知 2026/1/26 12:37:40

Qt 事件处理中 return 的深入解析

Qt 事件处理中 return 的深入解析 在 Qt 事件处理中&#xff0c;return 语句的使用是另一个关键概念&#xff0c;它与 event->accept()/event->ignore() 密切相关但作用不同。让我们详细分析一下它们之间的关系和工作原理。 核心区别&#xff1a;不同层级的事件处理 方…...

编程新知 2025/6/10 21:19:52

【Veristand】Veristand环境安装教程-Linux RT / Windows

首先声明&#xff0c;此教程是针对Simulink编译模型并导入Veristand中编写的&#xff0c;同时需要注意的是老用户编译可能用的是Veristand Model Framework&#xff0c;那个是历史版本&#xff0c;且NI不会再维护&#xff0c;新版本编译支持为VeriStand Model Generation Suppo…...

编程新知 2026/2/5 20:04:55

第一篇：Liunx环境下搭建PaddlePaddle 3.0基础环境（Liunx Centos8.5安装Python3.10+pip3.10）

第一篇&#xff1a;Liunx环境下搭建PaddlePaddle 3.0基础环境&#xff08;Liunx Centos8.5安装Python3.10pip3.10&#xff09; 一&#xff1a;前言二&#xff1a;安装编译依赖二&#xff1a;安装Python3.10三&#xff1a;安装PIP3.10四&#xff1a;安装Paddlepaddle基础框架4.1…...

编程新知 2026/1/31 20:22:32

论文阅读：Matting by Generation

今天介绍一篇关于 matting 抠图的文章&#xff0c;抠图也算是计算机视觉里面非常经典的一个任务了。从早期的经典算法到如今的深度学习算法&#xff0c;已经有很多的工作和这个任务相关。这两年 diffusion 模型很火&#xff0c;大家又开始用 diffusion 模型做各种 CV 任务了&am…...

编程新知 2026/2/9 12:41:44

C++ 类基础：封装、继承、多态与多线程模板实现

前言 C 是一门强大的面向对象编程语言&#xff0c;而类&#xff08;Class&#xff09;作为其核心特性之一&#xff0c;是理解和使用 C 的关键。本文将深入探讨 C 类的基本特性&#xff0c;包括封装、继承和多态&#xff0c;同时讨论类中的权限控制&#xff0c;并展示如何使用类…...

编程新知 2025/11/15 8:22:14

深入解析 ReentrantLock：原理、公平锁与非公平锁的较量

ReentrantLock 是 Java 中 java.util.concurrent.locks 包下的一个重要类，用于实现线程同步，支持可重入性，并且可以选择公平锁或非公平锁的实现方式。下面将详细介绍 ReentrantLock 的实现原理以及公平锁和非公平锁的区别。 ReentrantLock 实现原理 基本架构 ReentrantLo…...

编程新知 2025/10/12 23:48:51