CSS 选择器基本概念
选择器是 CSS 中的关键部分，用来选中指定元素并为其设置样式。
常见优先级可以先记为：ID 选择器 > 类选择器 > 标签选择器。
常见选择器类型
元素选择器
类选择器
ID 选择器
通用选择器
子元素选择器
后代选择器
相邻兄弟选择器
伪类选择器
元素选择器
直接通过标签名选择元素。
123h2 { color: green;}
类选择器
使用 . 加类名选择元素。
123.highlight { background-color: yellow;}
ID 选择器
使用 # 加 id 名选择元素。
1234#header { font-size: 24px; color: blue;}
通用选择器
使用 * 选中所有元素。
1234* { font-family: "kaiTi"; font-weight: bolder;}
子元素选择器
使用 > 选中某个元素的直接子元素。
1234.father > ...
CSS 导入方式CSS 三种导入方式1. 内联样式
直接写在标签的 style 属性中。
只作用于当前标签。
1<h1 style="color: red;">这是一个一级标题标签，使用内联样式</h1>
2. 内部样式表
写在 head 中的 <style> 标签里。
适合当前页面使用。
12345<style> h2 { color: green; }</style>
3. 外部样式表
通过 <link> 标签引入外部 .css 文件。
适合多个页面复用。
1<link rel="stylesheet" href="./css/style.css">
优先级
三种导入方式的优先级通常是：
内联样式 > 内部样式表 > 外部样式表
课堂示例代码HTML 文件12345678910111213141516171819202122232425262728293031<!DOCTYPE ...
CSS 简介与语法CSS 简介什么是 CSS
CSS 全称是 Cascading Style Sheets，中文叫 层叠样式表。
CSS 是一种用于定义网页样式和布局的样式表语言。
通过 CSS，可以设置页面中各个元素的颜色、字体、大小、间距、边框、背景等样式。
CSS 和 HTML 的关系
HTML 负责页面结构和内容。
CSS 负责页面样式和布局表现。
可以把 HTML 理解为毛坯房，把 CSS 理解为装修。
知识点总结
HTML 决定页面有什么。
CSS 决定页面长什么样。
CSS 的主要作用是美化页面和控制布局。
复习表达CSS 是层叠样式表，主要用于控制网页的外观和布局。HTML 负责页面结构，CSS 负责页面样式，两者配合完成一个完整的网页展示效果。
CSS 语法基本结构CSS 通常由 选择器、属性 和 属性值 组成。
1234选择器 { 属性1: 属性值1; 属性2: 属性值2;}
语法规则
一个选择器中可以写多条属性。
每一行属性通常都要以英文分号 ; 结尾。
属性和值以 键值对 的形式出现。
示例代码12345/* 这是一个 p 标 ...
CSS ??????
1-css?????
2-css????
3-css???
4-css????
5-css????
6-css??
7-css??
8-css?????
????
?? CSS ???????? CSS ??????????
?? CSS ???????????????????
?????????????????????????
?????????????????????????
????
CSS ???
CSS ? HTML ???
CSS ????
CSS ????
CSS ???
CSS ????
CSS ????
CSS ??
CSS ??
CSS ?????
HTML 表单基本概念
<form> 用于创建表单区域，常用于收集用户输入的数据。
表单中通常会配合 <input>、<label>、<button> 等标签一起使用。
常见表单控件
type="text"：单行文本输入框
type="password"：密码输入框
type="radio"：单选框
type="checkbox"：多选框
type="submit"：提交按钮
常见属性
placeholder：输入框提示文字
id：元素唯一标识
for：让 label 和指定表单控件关联
name：表单字段名称，单选框同组时通常设置相同的 name
value：按钮或表单项的值
action：表单提交地址
课堂示例代码123456789101112131415161718192021222324252627282930<form> <label>用户名：</label> <input ty ...
HTML 区块元素HTML 区块块元素和行内元素在 HTML 中，元素通常可以分为 块元素 和 行内元素，一个很重要的区分标准就是：是否独占一行。
块元素基本特点
块元素通常会从新行开始。
块元素默认会独占一整行。
块元素一般占据整行宽度。
块元素可以包含其他块元素和行内元素。
常见块元素
<div>
<p>
<h1> 到 <h6>
<ul>
<ol>
<li>
<table>
<form>
使用场景
块元素通常用于组织页面的主要结构和内容。
常用于创建页面中的大区域或逻辑区块。
12345<div class="content"> <h1>文章标题</h1> <p>文章内容</p> <p>文章内容</p></div>
课堂示例代码12345678910111213141516<div class="nav"> &l ...
HTML 标签属性HTML 标签属性基本概念
属性在 HTML 中非常重要，用于定义元素的行为、外观以及与其他元素的关系。
属性通常写在开始标签中。
基本语法1<开始标签 属性名="属性值">
属性示例12<p id="describe" class="section">这是一个段落标签</p><a href="https://www.baidu.com">这是一个超链接</a>
属性大小写说明
属性名称一般不区分大小写。
属性值通常对大小写敏感，尤其是在文件路径、类名、图片名等场景下。
123<img src="example.jpg" alt=""><img SRC="example.jpg" alt=""><img src="EXAMPLE.JPG" alt="">
前两个写法 ...
常用文本、列表与表格标签常用文本标签标题标签
<h1> 到 <h6> 用于定义标题。
数字越小，标题级别越高，默认字体也越大。
1234<h1>一级标题</h1><h2>二级标题</h2><h3>三级标题</h3><h4>四级标题</h4>
段落标签
<p> 用于定义段落文本。
1<p>这是一个段落。</p>
文本样式标签
<b>、<strong>：加粗文本
<i>、<em>：斜体文本
<u>、<ins>：下划线文本
<s>、<del>：删除线文本
12345678910<p> <b>字体加粗</b> <strong>字体加粗</strong> <i>字体斜体</i> <em>字体斜体</em> <u> ...
HTML 标签与文档结构HTML 标签基本概念
HTML 全称是 HyperText Markup Language，中文叫超文本标记语言。
HTML 通过一系列的标签，也叫元素，来定义文本、图像、链接等页面内容。
HTML 标签通常由尖括号包围，例如 <p>、<h1>、<a>。
双标签
双标签由开始标签和结束标签组成，内容写在两个标签之间。
123<p>这是一个段落。</p><h1>这是一个标题。</h1><a href="#">这是一个超链接。</a>
单标签
单标签通常用于没有内容的元素，只有一个标签本身。
123<input type="text"><br><hr>
单标签和双标签的区别
双标签用于有内容的元素。
单标签用于没有内容的元素。
知识点总结
HTML 的本质是使用标签来描述页面结构和内容。
常见页面内容如标题、段落、链接、输入框等，都是通过不同标签实现的。
学习 HTML ...
