html与css学习笔记(2)

news/2025/1/22 12:08:24/

一、CSS引入方式

具体有 3 种引入方式,语法如下表格所示:
引入方式语法
内联样式在HTML标签中使用style属性,例如:<div style="color: red;">这是一个红色的div</div>
内部样式表在HTML文件的<head>标签内使用<style>标签,例如:<head><style type="text/css">div { color: red; }</style></head>
外部样式表使用<link>标签在HTML文件的<head>标签内引入外部CSS文件,例如:<head><link rel="stylesheet" type="text/css" href="styles.css"></head>
对于上述 3 种引入方式,企业开发的使用情况如下:
1. 内联样式会出现大量的代码冗余,不方便后期的维护,所以不常用。
2. 内部样式,通过定义 css 选择器,让样式作用于当前页面的指定的标签上。
3. 外部样式, html css 实现了完全的分离,企业开发常用方式。

二、颜色表示

颜色的表示方式常见的有以下三种:

表示方式说明示例
颜色名称直接使用预定义的颜色名称来表示颜色,如red(红色)、blue(蓝色)、green(绿色)等。这些名称不区分大小写。<p style="color: red;">这是红色文本。</p>
十六进制值以#开头,后面跟着6个十六进制数字,每两位表示一种颜色成分的强度,分别对应红、绿、蓝(RGB)。例如,#FF0000表示红色,其中FF表示红色成分的最大值。<p style="color: #FF0000;">这是红色文本。</p>
RGB和RGBA值RGB值使用rgb()函数表示,参数为红、绿、蓝三种成分的强度,范围为0到255。RGBA值在此基础上增加了一个表示不透明度的参数,范围为0到1。<p style="color: rgb(255, 0, 0);">这是红色文本。</p> <p style="color: rgba(255, 0, 0, 0.5);">这是半透明红色文本。</p>

三、CSS选择器

选择器类型语法作用示例
元素(标签)选择器标签名选择所有指定标签元素p { color: red; }
id选择器# + id属性值选择具有特定id的唯一元素#myId { background-color: blue; }
类选择器. + 类名选择具有特定类名的所有元素.myClass { font-size: 16px; }

优先级

id选择器#myId的优先级最高,类选择器.myClass的优先级次之,元素选择器p的优先级最低。

 


http://www.ppmy.cn/news/1565215.html

相关文章

Django学习笔记(安装和环境配置)-01

Django学习笔记(安装和环境配置)-01 一、创建python环境 1、可以通过安装Anaconda来创建一个python环境 # 创建一个虚拟python环境 conda create -n django python3.8 # 切换激活到创建的环境中 activate django2、安装django # 进入虚拟环境中安装django框架 pip install …

Python 常用运维模块之Shutil 模块

Python 常用运维模块之Shutil 模块 Shutil 模块复制源文件到目标路径复制源文件权限到目标文件复制源文件的最近修改时间、权限等元信息到目标文件复制源文件到目标路径&#xff08;包含文件名&#xff09;复制源文件及相关元信息到目标路径移动文件或目录获取磁盘使用情况复制…

第01章 22 使用 vtkStructuredGrid 实现一个分形的树枝状几何体

以下是一个简单的示例&#xff0c;展示如何使用 vtkStructuredGrid 实现一个分形的树枝状几何体。我们将基于递归的分形算法生成树枝结构&#xff0c;并将其存储在 vtkStructuredGrid 中。 示例代码 #include <vtkSmartPointer.h> #include <vtkPoints.h> #includ…

【C++】引用(上)

1、引用的基本使用 作用&#xff1a;给变量起别名 语法&#xff1a;数据类型&#xff08;该数据类型要与原名的数据类型一致&#xff09; &别名原名&#xff1b; 示例&#xff1a; #include<iostream> using namespace std; int main() {int a 10;int& …

who w who

https://www.ityww.cn/733.html Linux查看用户登录信息命令-w & who & whoami Linux 基础 yvan 8年前 (2017-02-04) 3633次浏览 已收录 0个评论 显示当前已登录用户会话及动作命令-w 格式&#xff1a;w [options] [rootlocalhost ~]# w 23:46:39 up 8:29, 2 users, lo…

Linux:文件描述符fd、系统调用open

目录 一、文件基础认识 二、C语言操作文件的接口 1.> 和 >> 2.理解“当前路径” 三、相关系统调用 1.open 2.文件描述符 3.一切皆文件 4.再次理解重定向 一、文件基础认识 文件 内容 属性。换句话说&#xff0c;如果在电脑上新建了一个空白文档&#xff0…

场馆预定平台高并发时间段预定实现V2

&#x1f3af; 本文档介绍了场馆预订系统接口V2的设计与实现&#xff0c;旨在解决V1版本中库存数据不一致及性能瓶颈的问题。通过引入令牌机制确保缓存和数据库库存的最终一致性&#xff0c;避免因服务器故障导致的库存错误占用问题。同时&#xff0c;采用消息队列异步处理库存…

通过视觉语言模型蒸馏进行 3D 形状零件分割

大家读完觉得有帮助记得关注和点赞&#xff01;&#xff01;&#xff01;对应英文要求比较高&#xff0c;特此说明&#xff01; Abstract This paper proposes a cross-modal distillation framework, PartDistill, which transfers 2D knowledge from vision-language models …