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

css学习3（三种样式表与样式控制优先级）

news 2026/2/9 22:30:09

1、外部样式表：当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表，也要放到<head>中。

2、外部样式表可以在任何文本编辑器中进行编辑。文件不能包含任何的 html 标签。样式表应该以 .css 扩展名进行保存。

3、当单个文档需要特殊的样式时，就应该使用内部样式表。你可以使用 <style> 标签在文档头部<head>定义内部样式表。

4、当样式仅需要在一个元素上应用一次时，要使用内联样式，你需要在相关的标签内使用样式（style）属性。Style 属性可以包含任何 CSS 属性。

5、如果某些属性在不同的样式表中被同样的选择器定义，那么属性值将从更具体的样式表中被继承过来。

6、多重样式优先级：（内联样式）Inline style > （内部样式）Internal style sheet >（外部样式）External style sheet > 浏览器默认样式

7、如果外部样式放在内部样式的后面，则外部样式将覆盖内部样式。

8、CSS优先规则：内联样式 > id 选择器 > 类选择器 = 伪类选择器 = 属性选择器 > 标签选择器 = 伪元素选择器

h3 {color:blue;
}
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>内外样式</title><!--<link rel="stylesheet" type="text/css" href="style.css"/>--><style type="text/css">h3{color:green;}#content-id{/*id控制*/color: red;}.content-class{/*类控制*/color: blue;}div{/*元素控制*/color: yellow;}</style><link rel="stylesheet" type="text/css" href="style.css"/>        </head><body><h3>外部蓝色，内部绿色</h3><div class="content-class" id="content-id">PHP</div></body>
</html>

 运行结果：

 

相关文章：

css学习3（三种样式表与样式控制优先级）

1、外部样式表&#xff1a;当样式需要应用于很多页面时&#xff0c;外部样式表将是理想的选择。在使用外部样式表的情况下&#xff0c;你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表&#xff0c;也要放到<head>中。 2、外部…...

编程日记 2023/8/20 22:32:15

【JS深层解析】内存

前言 接触过 C 语言的小伙伴应该了解：C语言拥有底层最原始的内存管理办法，例如：malloc() 和 free()方法，它们被开发者用来从操作系统中分配和释放内存。 然而在JavaScript这门语言中，当我们创建了一个东西（可以被读写、传递的数据），浏览器中的 js 引擎会根据创建这个…...

编程日记 2023/8/20 22:31:14

第二章：25+ Python 数据操作教程（第十四节NUMPY 教程与练习）

NumPy（“Numerical Python”或“Numeric Python”的缩写）是 Python 中对数组和矩阵进行快速数学计算的最基本的软件包之一。在处理多维数据时它也非常有用。集成C、C++和FORTRAN工具是一件幸事。它还提供了许多傅里叶变换 (FT) 和线性代数函数。 为什么使用 NumPy 而不是列…...

编程日记 2023/8/20 22:30:11

Pycharm与Anaconda Python的开发环境搭建

目录 一&#xff1a;下载 二&#xff1a;安装python 三&#xff1a;设置Pycharm 一&#xff1a;下载 下载Anaconda&#xff1a; Anaconda | The World’s Most Popular Data Science Platform 安装好以后&#xff0c;设置一下环境变量&#xff1a; 打开命令行&#xff0c…...

编程日记 2023/8/20 22:29:09

2.创建小程序

创建 在开发工具中，选择小程序，点击加号 填写小程序信息，模板使用的是TS+Sass 编辑器的工作区 目录结构 项目使用的是ts的模板，目录结构和js的有一点差异，目录结构如下： miniprogram：小程序根目录 —pages：小程序页面目录 ——xxx：页面目录，一个页面对应一个目…...

编程日记 2023/8/20 22:28:06

XenDesktop5.6如何连接数据库

Citrix在数据库的连接方式上一直不统一&#xff0c;但是也还是有迹可循的。 经过了好长时间的下载以后&#xff0c;今天终于有时间来测试一下最新版本的XenDesktop 5 SP1&#xff0c;由于结合了其他组件和环境的需要&#xff0c;所以&#xff0c;选择了独立部署数据库&#xf…...

编程日记 2023/8/20 22:27:04

OAuth2.0一 Spring Security OAuth2.0

这里主讲OAuth2.0 学习OAuth2前提&#xff1a; 掌握Spring Security Spring Security学习 一 OAuth2.0介绍 OAuth&#xff08;Open Authorization&#xff09;是一个关于授权&#xff08;authorization&#xff09;的开放网络标准&#xff0c;允许用户授权第三方应用访问他们…...

编程日记 2023/8/20 22:25:01

【linux】kernel编译时相关报错

文章目录 1. 问题现象及解决方式1. cc1: error: code model kernel does not support PIC mode 1. 问题现象及解决方式 1. cc1: error: code model kernel does not support PIC mode 问题&#xff1a;编译module时报错 原因&#xff1a;未指定交叉编译器&#xff0c;导致默认…...

编程日记 2023/8/20 22:23:59

C语言 功能型API --------------------strcat()

NAME strcat, strncat - concatenate two strings 头文件 SYNOPSIS #include <string.h> 函数原型&#xff1a; char *strcat(char *dest, const char *src); 功能&#xff1a; 在字符串dest的末尾将字符串src拼接上去 #include <stdio.h> #inc…...

编程日记 2023/8/20 22:22:58

企业展示小程序搭建指南

如今&#xff0c;移动互联网的快速发展&#xff0c;为企业展示提供了更多元化的方式。除了传统的宣传手段&#xff0c;企业还可以借助小程序来展示自己的实力和产品。本文将为大家介绍一种简单的DIY小程序的方法&#xff0c;让企业能够快速打造自己的展示平台。 首先&#xff0…...

编程日记 2023/8/20 22:21:56

大模型技术实践（一）｜ChatGLM2-6B基于UCloud UK8S的创新应用

近半年来&#xff0c;通过对多款主流大语言模型进行了调研&#xff0c;我们针对其训练方法和模型特点进行逐一分析&#xff0c;方便大家更加深入了解和使用大模型。本文将重点分享ChatGLM2-6B基于UCloud云平台的UK8S实践应用。 01各模型结构及特点 自从2017年6月谷歌推出Transf…...

编程日记 2023/8/20 22:20:55

Flink状态和状态管理

1.什么是状态 官方定义&#xff1a;当前计算流程需要依赖到之前计算的结果&#xff0c;那么之前计算的结果就是状态。 这句话还是挺好理解的&#xff0c;状态不只存在于Flink&#xff0c;也存在生活的方方面面&#xff0c;比如看到一个认识的人&#xff0c;如何识别认识呢&am…...

编程日记 2023/8/20 22:19:53

【3Ds Max】布料命令的简单使用

简介 在3ds Max中&#xff0c;"布料"&#xff08;Cloth&#xff09;是一种模拟技术&#xff0c;用于模拟物体的布料、织物或软体的行为&#xff0c;例如衣物、帆布等。通过应用布料模拟&#xff0c;您可以模拟出物体在重力、碰撞和其他外力作用下的变形和动态效果。…...

编程日记 2023/8/20 22:18:52

用 VB.net，VBA 两种方式 读取单元格内的 换行数据，并出力到 CSV文件

用 VB.net&#xff0c;VBA 两种方式 读取单元格内的 换行数据&#xff0c;并出力到 CSV文件 需求 如下图所示&#xff0c;为了生成csv文件导入数据库&#xff0c;需要将下图 的 1 和 2 拼接成 如下 3 所示的一行数据&#xff0c; 开头为 1 &#xff0c;往后为 2 的换行数据 将换…...

编程日记 2023/8/20 22:17:50

kafka线上问题优化

如何防止消息丢失 生产者&#xff1a; 使用同步发送把ack设成1或者all&#xff08;非0&#xff0c;0可能会出现消息丢失的情况&#xff09;&#xff0c;并且设置同步的分区数>2 消费者&#xff1a;把自动提交改成手动提交 如何防止重复消费 在防止消息丢失的方案中&#…...

编程日记 2023/8/20 22:16:46

FifthOne：用于矢量搜索的计算机视觉接口

一、说明 数据太多了。数据湖和数据仓库;广阔的像素牧场和充满文字的海洋。找到正确的数据就像大海捞针一样&#xff01;如果你喜欢开源机器学习库 FiftyOne&#xff0c;矢量搜索引擎通过将复杂数据&#xff08;图像的原始像素值、文本文档中的字符&#xff09;转换为称为嵌入矢…...

编程日记 2023/8/20 22:15:43

认识Axios

axios中文网 一. 为什么会诞生Axios 最初浏览器页面向服务器请求数据时&#xff0c;返回的是整个页面&#xff0c;整个页面都会刷新ajax的出现&#xff0c;它可以在页面无刷新的情况下请求数据原生的XMLHttpRequest&#xff0c;jQuery封装的ajax&#xff0c;以及axios都可以实…...

编程日记 2023/8/20 22:14:41

系统架构设计专业技能 · 信息安全技术

系列文章目录 系统架构设计专业技能 网络技术&#xff08;三&#xff09; 系统架构设计专业技能 系统安全分析与设计&#xff08;四&#xff09;【系统架构设计师】 系统架构设计高级技能 软件架构设计&#xff08;一&#xff09;【系统架构设计师】 系统架构设计高级技能 …...

编程日记 2023/8/20 22:13:39

kafka晋升之路-理论+场景

kafka晋升之路 一&#xff1a;故事背景二&#xff1a;核心概念2.1 系统架构2.2 生产者&#xff08;Producer&#xff09;2.2.1 生产者分区2.2.2 生产者分区策略 2.3 经纪人&#xff08;Broker&#xff09;2.3.1 主题&#xff08;Topic&#xff09;2.3.2 分区&#xff08;Partit…...

编程日记 2023/8/20 22:12:37

(牛客网)链表相加(二)

嗯哼~ 题目 描述 假设链表中每一个节点的值都在 0 - 9 之间&#xff0c;那么链表整体就可以代表一个整数。 给定两个这种链表&#xff0c;请生成代表两个整数相加值的结果链表。 数据范围&#xff1a;0 ≤ n,m ≤ 1000000&#xff0c;链表任意值 0 ≤ val ≤ 9 要求&#x…...

编程日记 2023/8/20 22:11:36

利用最小二乘法找圆心和半径

#include <iostream> #include <vector> #include <cmath> #include <Eigen/Dense> // 需安装Eigen库用于矩阵运算 // 定义点结构 struct Point { double x, y; Point(double x_, double y_) : x(x_), y(y_) {} }; // 最小二乘法求圆心和半径 …...

编程新知 2026/2/8 4:37:37

大型活动交通拥堵治理的视觉算法应用

大型活动下智慧交通的视觉分析应用 一、背景与挑战 大型活动&#xff08;如演唱会、马拉松赛事、高考中考等&#xff09;期间&#xff0c;城市交通面临瞬时人流车流激增、传统摄像头模糊、交通拥堵识别滞后等问题。以演唱会为例&#xff0c;暖城商圈曾因观众集中离场导致周边…...

编程新知 2026/1/23 7:15:40

【位运算】消失的两个数字（hard）

消失的两个数字&#xff08;hard&#xff09; 题⽬描述&#xff1a;解法&#xff08;位运算&#xff09;&#xff1a;Java 算法代码&#xff1a;更简便代码 题⽬链接&#xff1a;⾯试题 17.19. 消失的两个数字 题⽬描述&#xff1a; 给定⼀个数组&#xff0c;包含从 1 到 N 所有…...

编程新知 2025/11/15 16:18:24

【大模型RAG】Docker 一键部署 Milvus 完整攻略

本文概要 Milvus 2.5 Stand-alone 版可通过 Docker 在几分钟内完成安装&#xff1b;只需暴露 19530&#xff08;gRPC&#xff09;与 9091&#xff08;HTTP/WebUI&#xff09;两个端口&#xff0c;即可让本地电脑通过 PyMilvus 或浏览器访问远程 Linux 服务器上的 Milvus。下面…...

编程新知 2026/1/31 8:08:07

【算法训练营Day07】字符串part1

文章目录 反转字符串反转字符串II替换数字 反转字符串 题目链接&#xff1a;344. 反转字符串 双指针法&#xff0c;两个指针的元素直接调转即可 class Solution {public void reverseString(char[] s) {int head 0;int end s.length - 1;while(head < end) {char temp …...

编程新知 2025/8/27 14:38:58

新能源汽车智慧充电桩管理方案：新能源充电桩散热问题及消防安全监管方案

随着新能源汽车的快速普及&#xff0c;充电桩作为核心配套设施&#xff0c;其安全性与可靠性备受关注。然而&#xff0c;在高温、高负荷运行环境下&#xff0c;充电桩的散热问题与消防安全隐患日益凸显&#xff0c;成为制约行业发展的关键瓶颈。 如何通过智慧化管理手段优化散…...

编程新知 2026/1/29 3:00:56

解决本地部署 SmolVLM2 大语言模型运行 flash-attn 报错

出现的问题 安装 flash-attn 会一直卡在 build 那一步或者运行报错 解决办法 是因为你安装的 flash-attn 版本没有对应上&#xff0c;所以报错&#xff0c;到 https://github.com/Dao-AILab/flash-attention/releases 下载对应版本&#xff0c;cu、torch、cp 的版本一定要对…...

编程新知 2025/11/3 2:11:24

【C语言练习】080. 使用C语言实现简单的数据库操作

080. 使用C语言实现简单的数据库操作 080. 使用C语言实现简单的数据库操作使用原生APIODBC接口第三方库ORM框架文件模拟1. 安装SQLite2. 示例代码：使用SQLite创建数据库、表和插入数据3. 编译和运行4. 示例运行输出：5. 注意事项6. 总结080. 使用C语言实现简单的数据库操作 在…...

编程新知 2025/9/22 21:37:01

MySQL 8.0 OCP 英文题库解析（十三）

Oracle 为庆祝 MySQL 30 周年&#xff0c;截止到 2025.07.31 之前。所有人均可以免费考取原价245美元的MySQL OCP 认证。 从今天开始&#xff0c;将英文题库免费公布出来&#xff0c;并进行解析&#xff0c;帮助大家在一个月之内轻松通过OCP认证。 本期公布试题111~120 试题1…...

编程新知 2026/1/31 7:25:57

DeepSeek 技术赋能无人农场协同作业：用 AI 重构农田管理 “神经网”

目录 一、引言二、DeepSeek 技术大揭秘2.1 核心架构解析2.2 关键技术剖析 三、智能农业无人农场协同作业现状3.1 发展现状概述3.2 协同作业模式介绍 四、DeepSeek 的 “农场奇妙游”4.1 数据处理与分析4.2 作物生长监测与预测4.3 病虫害防治4.4 农机协同作业调度 五、实际案例大…...

编程新知 2025/9/24 13:35:36