html与css学习笔记（2）
一、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的优先级最低。