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

css持续学习

一、样式层叠

当一个css样式发生冲突时,比如多处给一个字体设置了不同的颜色,这个时候就需要样式层叠了,它会进行三种比较

  • 比较重要性
    重要性从高到低:
    1.带有 important 的作者样式(作者样式就是开发者写的样式)
    2.带有 important 的默认样式(默认样式就是浏览器的默认样式)
    3.作者样式
    4.默认样式
  • 比较特殊性
    特殊性也被称为权重,由四位数组成(0,0,0,0),不能进位,由左向右比较,只有当前位相同的时候,才会比较后一位
    在这里插入图片描述
  • 比较源次序
    比较样式在代码中的顺序,后面的会覆盖前面的,当然也要搞清楚比较哪里的顺序
<!-- 不是比较这里的顺序 -->
<div class="home nav">111</div> 
//是比较这里的顺序,可以测试一下,你会发现字体颜色为red
.nav{color:pink
}
.home{color:red
}

**注意:**这三个比较也是顺序比较,只有当前比较是一样的时候,才会进行下一个比较,比如比较重要性时,都是作者样式,才会比较特殊性,如果一个是作者样式,一个是默认样式,就是默认样式的特殊性更高,一样会使用作者样式,因为并没有到比较特殊性的阶段

相关文章:

css持续学习

一、样式层叠 当一个css样式发生冲突时&#xff0c;比如多处给一个字体设置了不同的颜色&#xff0c;这个时候就需要样式层叠了&#xff0c;它会进行三种比较 比较重要性 重要性从高到低&#xff1a; 1.带有 important 的作者样式&#xff08;作者样式就是开发者写的样式&…...

FFmpeg 关于AV1编码指导文档介绍

介绍 本篇博客主要介绍FFMpeg中关于AV1编码支持说明,主要根据官方wiki说明进行总结。官方wiki地址:AV1AV1是一种由Alliance for Open Media (AOMedia)开发的开源且免版税的视频编解码器,它在压缩效率上比VP9高出约30%,比H.264高出约50%。目前,FFmpeg支持三种AV1编码器:li…...

鸿蒙系统——强大的分布式系统

鸿蒙相比较于传统安卓最最最主要的优势是微内核分布式操作系统&#xff0c;具有面向未来&#xff0c;跨设备无缝协作&#xff0c;数据共享的全场景体验。下面简单来感受一下鸿蒙系统的多端自由流转。 自由流转概述 场景介绍 随着全场景多设备的生活方式不断深入&#xff0c;…...

centos7 安装单机MongoDB

centos7安装单机 yum 安装 1、配置yum源 vim /etc/yum.repos.d/mongodb.repo [mongodb-org-7.0] nameMongoDB Repository baseurlhttps://repo.mongodb.org/yum/redhat/$releasever/mongodb-org/7.0/x86_64/ gpgcheck1 enabled1 gpgkeyhttps://www.mongodb.org/static/pgp…...

数据库回表介绍

索引覆盖 索引覆盖或称为覆盖索引&#xff0c;是数据库中的一种优化手段当我们在执行一个sql查询时&#xff0c;如果只需要查询某几个字段的值&#xff0c;并且这几个字段的数据都已经被包含在某一个索引中(而不是全表扫描)&#xff0c;那么数据库引擎就会直接通过这个索引来取…...

python多继承的3C算法

python多继承的3C算法 有很多地方都说python多继承的继承顺序&#xff0c;是按照深度遍历的方式&#xff0c;其实python多继承顺序的算法&#xff0c;不是严格意义上的深度遍历&#xff0c;而是基于深度遍历基础上优化出一种叫3C算法 python多继承的深度遍历 class C:def ru…...

掌握Python编程的深层技能

一、Python基础语法、变量、列表、字典等运用 1.运行python程序的两种方式 1.交互式即时得到程序的运行结果 2.脚本方式把程序写到文件里(约定俗称文件名后缀为.py),然后用python解释器解释执行其中的内容2.python程序运行的三个步骤 python3.8 C:\a\b\c.py 1.先启动python3…...

Echarts地图实现:各省市计划录取人数

Echarts地图实现&#xff1a;各省市计划录取人数 实现功能 本文将介绍如何使用 ECharts 制作一个展示中国人民大学2017年各省市计划录取人数的地图。我们将实现以下图表形式&#xff1a; 地图&#xff1a;基础的地图展示&#xff0c;反映不同省市的录取人数。散点图&#xf…...

shell脚本if/else使用示例

if判断字符串是否为空实例if判断整数是否为奇数实例if判断整数是否为偶数实例if判断整数是否为正数实例if判断整数是否为负数实例输入两个字符串&#xff0c;输出字符串的大小关系输入学生的成绩判断是否合法输入学生的成绩判断是否及格判断平年闰年输入文件判断文件是否是普通…...

【D3.js in Action 3 精译】1.2.2 可缩放矢量图形(二)

当前内容所在位置 第一部分 D3.js 基础知识 第一章 D3.js 简介 1.1 何为 D3.js&#xff1f;1.2 D3 生态系统——入门须知 1.2.1 HTML 与 DOM1.2.2 SVG - 可缩放矢量图形 ✔️ 第一部分【第二部分】✔️第三部分&#xff08;精译中 ⏳&#xff09; 1.2.3 Canvas 与 WebGL&#x…...

Java中的Monad设计模式及其实现

Java中的Monad设计模式及其实现 在函数式编程中&#xff0c;Monad是一种重要的设计模式&#xff0c;用于处理包含隐含计算信息&#xff08;如计算顺序、环境、状态、错误处理等&#xff09;的计算。Monad提供了一种结构&#xff0c;使得可以将计算链式连接起来&#xff0c;每一…...

Dahlia Hart: Stylized Casual Character(休闲角色模型)

此包包含两个发型和两个服装&#xff0c;每个都有多种颜色选择。每个发型都适合与物理资源一起使用&#xff0c;并包含各种表情和音素混合形状。 下载&#xff1a;​​Unity资源商店链接资源下载链接 效果图&#xff1a;...

vector容器

以下是关于vector容器的总结 1、构造容器 2、容器赋值 3、获取容量capacity和大小size 4、插入和删除 5、数据存取 6、互换容器和预留空间 #include <iostream> #include <vector>using namespace std; // vector数据结构和数组非常相似&#xff0c;也称为单端数组…...

二进制常用知识整理<java>

1、进制转换&#xff1a; int转二进制&#xff1a; public static void main(String[] args) {int a 0b100;//0b表示后面的为二进制表示&#xff0c;0开始表示八进制System.out.println(a);System.out.println(Integer.toBinaryString(a));System.out.println(Integer.toStr…...

基于Docker的淘客返利平台部署

基于Docker的淘客返利平台部署 大家好&#xff0c;我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01;在本文中&#xff0c;我们将探讨如何利用Docker技术来部署一个淘客返利平台。Doc…...

【涵子来信科技潮流】——WWDC24回顾与暑假更新说明

期末大关&#xff0c;即将来袭。在期末之前&#xff0c;我想发一篇文章&#xff0c;介绍有关WWDC24的内容和暑假中更新的说明。本篇文章仅为个人看法和分享&#xff0c;如需了解更多详细内容&#xff0c;请通过官方渠道或者巨佬文章进行进一步了解。 OK, Lets go. 一、WWDC24 …...

重温react-08(createContext使用方式)

react中的createContext使用方式 简介一下&#xff0c;就是组件之间可以互相通信的比较好用的传值方式&#xff0c;话不多说直接上代码。 以下介绍的是类组件中的方式&#xff0c;在函数组件中不是如此使用的。 定义一个通用的方法 import { createContext } from "react…...

LInux后台运行程序

测试c代码 #include <stdio.h> #include <unistd.h> int main() {for (int i;; i) {printf("b数值 %d\n", i);fflush(stdout);sleep(3);} }使用CtrlZ可以将当前正在运行的程序放到后台并暂停它。如果你想要继续这个暂停的程序&#xff0c;可以使用fg命令…...

DEBOPIE框架:打造最好的ChatGPT交易机器人

本文介绍了如何利用 DEBOPIE 框架并基于 ChatGPT 创建高效交易机器人&#xff0c;并强调了在使用 AI 辅助交易时需要注意的限制以及操作步骤。原文: Build the Best ChatGPT Trading Bots with my “DEBOPIE” Framework 如今有大量文章介绍如何通过 ChatGPT 帮助决定如何以及在…...

C++ Thead多线程 condition_variable 与其使用场景---C++11多线程快速学习

std::condition_variable 的步骤如下&#xff1a; 创建一个 std::condition_variable 对象。 创建一个互斥锁 std::mutex 对象&#xff0c;用来保护共享资源的访问。 在需要等待条件变量的地方 使用 std::unique_lock<std::mutex> 对象锁定互斥锁 并调用 std::conditio…...

GPEN技术白皮书精读:生成先验如何解决人脸超分病态逆问题

GPEN技术白皮书精读&#xff1a;生成先验如何解决人脸超分病态逆问题 1. 引言&#xff1a;从模糊到高清的AI魔法 你有没有遇到过这样的情况&#xff1f;翻看老照片时&#xff0c;发现那些珍贵的面孔已经模糊不清&#xff1b;或者用AI生成图片时&#xff0c;人脸总是出现奇怪的…...

Llama-3.2V-11B-cot真实案例展示:OCR后图像逻辑推理生成可验证结论

Llama-3.2V-11B-cot真实案例展示&#xff1a;OCR后图像逻辑推理生成可验证结论 1. 模型能力概览 Llama-3.2V-11B-cot是一个突破性的视觉语言模型&#xff0c;它不仅能理解图像内容&#xff0c;还能进行系统性推理并生成可验证的结论。这个基于LLaVA-CoT论文实现的模型&#x…...

5步精通Trilium中文版:构建高效个人知识管理系统

5步精通Trilium中文版&#xff1a;构建高效个人知识管理系统 【免费下载链接】trilium-translation Translation for Trilium Notes. Trilium Notes 中文适配, 体验优化 项目地址: https://gitcode.com/gh_mirrors/tr/trilium-translation 认识Trilium&#xff1a;重新定…...

Spring Cloud集成Nacos配置中心常见问题解析

1. Spring Cloud集成Nacos配置中心常见问题解析 在微服务架构中&#xff0c;配置中心是必不可少的基础组件。Nacos作为阿里巴巴开源的一款集服务发现、配置管理于一体的中间件&#xff0c;凭借其轻量级、高可用等特性&#xff0c;已经成为Spring Cloud生态中配置中心的热门选择…...

跨显卡上采样技术优化指南:从原理到实战的显卡性能提升方案

跨显卡上采样技术优化指南&#xff1a;从原理到实战的显卡性能提升方案 【免费下载链接】OptiScaler OptiScaler bridges upscaling/frame gen across GPUs. Supports DLSS2/XeSS/FSR2 inputs, replaces native upscalers, enables FSR3 FG on non-FG titles. Supports Nukem m…...

Phi-4-mini-reasoning应用场景:AI编程教练中算法题逻辑拆解与反馈生成

Phi-4-mini-reasoning应用场景&#xff1a;AI编程教练中算法题逻辑拆解与反馈生成 1. 模型介绍 Phi-4-mini-reasoning是一款专注于推理任务的文本生成模型&#xff0c;特别擅长处理需要多步逻辑分析的场景。与通用聊天模型不同&#xff0c;它被设计用来解决数学题、逻辑题等需…...

CodeT5安全使用指南:如何避免代码生成中的潜在风险

CodeT5安全使用指南&#xff1a;如何避免代码生成中的潜在风险 【免费下载链接】CodeT5 Home of CodeT5: Open Code LLMs for Code Understanding and Generation 项目地址: https://gitcode.com/gh_mirrors/co/CodeT5 CodeT5作为一款强大的代码理解与生成AI模型&#x…...

告别繁琐输入:基于SmartConfig与微信的ESP8266/ESP32一键配网实战

1. 为什么我们需要一键配网技术&#xff1f; 每次拿到新的智能设备&#xff0c;最头疼的就是怎么把它连上家里的Wi-Fi。传统的配网方式通常需要你在手机App里手动输入Wi-Fi名称和密码&#xff0c;这个过程不仅繁琐&#xff0c;还容易出错。想象一下&#xff0c;你要给10个智能灯…...

LeetCode 111. Minimum Depth of Binary Tree 题解

LeetCode 111. Minimum Depth of Binary Tree 题解 题目描述 给定一个二叉树&#xff0c;找出其最小深度。 最小深度是从根节点到最近叶子节点的最短路径上的节点数量。 叶子节点 是指没有子节点的节点。 示例 1&#xff1a; 输入&#xff1a;root [3,9,20,null,null,15,7] 输…...

避开这5个坑!用MediaRecorder+Vue3实现高兼容性语音输入

Vue3MediaRecorder实战&#xff1a;5个关键技巧打造高兼容语音输入方案 在移动优先的时代&#xff0c;语音输入已成为提升用户体验的重要交互方式。但当你兴奋地在Vue3项目中集成MediaRecorder API时&#xff0c;可能会遇到iOS设备上的静默失败、Android机型上的格式兼容性问题…...