html+css+js
HTML工作原理：HTML是部署在服务器上的文本文件，根据HTTP协议浏览器发出请求给服务器，服务器做出响应给浏览器返回一个HTML，浏览器解释执行HTML，从而显示内容
什么是HTML？
HTML是超文本标记语言（Hyper Text Markup Language）,一种纯文本类型的语言，用来设计网页的标记语言，用该语言编写的文件以.html或者.htm为后缀，由浏览器解释执行，在HTML的页面上可以嵌套脚本语言编写程序段，如JavaScript
HTML标签
HTML标签通常也被称为HTML标记，HTML元素；HTML标签是由尖括号包围的关键字，比如<html>，HTML标签通常是成对出现的,比如<b></b>，标签对中的第一个标签为开始标签，第二个标签为结束标签，开始标签和结束标签也被称为开放标签和闭合标签
HTML注释：
<!–注释内容 -->
可以将注释插入 HTML 代码中，这样可以提高其可读性，使代码更易被人理解。浏览器会忽略注释，也不会显示它们
HTML文档类型：
<!DOCTYPE>声明：HTML由多个不同的版本，只有完全明白页面中的使用的确切HTML版本，浏览器才能完全正确的显示HTML页面，这就是<!DOCTYPE>的意义；
<!DOCTYPE>不是HTML的标签，它为浏览器提供一项信息，即HTML是用什么版本所写的
HTML<head>标签：
定义：<head>标签用于定义文档的头部，是所有头部元素的容器，<head>中的元素可以引用脚本，指示浏览器在哪里找到样表式，提供元信息等等
文档的头部描述了文档的各种信息和属性，包括文档的标题，在web中的位置以及和其他文档的关系等，绝大多数文档的头部包含的数据都不会真正的作为内容显示给读者
以下这些标签可用在ad部分：<title>,<meta>,<link>,<style>,<script>,<base>
文本元素：
作用：文本时网页上的重要组成部分，直接书写的文本会用浏览器默认的样式显示
文本元素列表：是包含在文本元素中的文本，则会被显示为元素所拥有的样式
HTML标题：
标题是通过<h1>~<h6>标签进行定义的，目的是为了能够以醒目的方式显示，<h1>定义最大标题，<h6>定义最小标题
HTML段落：
段落是通过<p>标签进行定义的，<p>元素提供了结构化文本的一种方式，<p>元素对中的文本会以单独的段落显示，与前后文本换行分开，添加一段额外的垂直空白距离，作为行间距
HTML列表：
列表是将具有相似特征或先后顺序的几行文字进行对齐排列，所有列表都是由列表类型和列表项组成
列表类型：
有序列表 <ol>：用于列出表面上有特定次序的一些项目，其中只能包含列表项<li>
无序列表 <ul>：用于列出页面上没有特定次序的一些项目，也只能包含具体列表项元素<li>
列表项：用来表示列表具体的内容 <li>
HTML列表嵌套：将列表元素嵌套使用，可以建多层列表
HTML分区元素：
用于元素的一些分组，常用于页面布局，块分区元素<div></div>,行内分区元素<span></span>
元素显示方式：
块级元素：默认情况下，块级元素独占一行，即元素前后都会自动换行，比如<p>,<div>
行内元素：不会换行,与其他行内元素位于同一行
<span>元素是内联元素,可用作文本的容器，无特定的含义
<i>元素定义斜体字
<em>定义着重文字
<del>用来定义带删除线的文字
<u>用来定义带下划线的文字
空格折叠：默认情况下，HTML中的多个空格，多个换行符会压缩成单个空格，即只显示一个空格
实体引用：空格： ；（小于号）<:< （大于号 ） >:>；
什么是CSS?
CSS是层叠样式表（Cascading Style Sheets），样式定义了如何显示HTML元素，样式通常储存在样式表中，CSS是HTML的化妆师
如何使用CSS？
内联样式：定义在单个HTML元素中
内部样式表 ：定义在HTML的头元素中
外部样式表：将样式定义在外部的CSS文件中（.css）,由HTML页面引用样式表文件
内联样式：定义在HTML元素的属性style里面
css语法：只需要将分号隔开的一个或多个属性作为元素的style属性值，属性值之间用冒号（:）连接，多个属性值之间用分号（;）隔开
内部样式表：在HTML的<head>元素内部添加<style>元素
外部样式表：样式定义在独立的CSS文件中，一个纯文本文件，后缀为.css,该文件只包含样式规则
使用方法：①创建外部样式表文件
②引用该样式文件
<link rel="stylesheet" type="text/css" href="文件地址值"\>
CSS语法规范：
CSS规则由俩个部分构成：选择器，以及一条或多条样式声明
CSS注释：CSS注释以 “/*” 开始, 以 “*/” 结束,/*这是个注释*/
CSS规则特性
优先级：同一个元素若存在多个CSS规则，对应冲突的声明以优先级高者为准（就近原则）
层叠性：同一个元素若存在多个CSS规则，对于不冲突的声明可以叠加
继承性：父元素的CSS声明可以被子元素继承，如字体，颜色
CSS选择器
元素选择器：能通过元素名来选择 CSS 作用的目标
类选择器：能够附带 class 属性的元素都可以使用此样式声明，将元素的 class 属性设置为样式类名，可以将类选择器和元素选择器结合使用，以实现对某种元素的中不同样式的细分控制 (.class_name)
ID选择器：以一种独立于文档元素的方式，它仅作用于id属性的值 (#id_name)
选择器组：选择器声明为以逗号隔开的选择器列表，将一些相同的规则作用于多个元素
派生选择器：用来选择子元素
分类：后代选择器：选择某元素的后代（子孙）元素
子元素选择器：选择某元素的所有子元素
伪类选择器：用于设置同一个元素在不同状态下的样式
常用伪类:
:link向未被访问的超链接添加样式
:visited 向已被访问的添加样式
:active:向未激活的元素添加样式
:hover:当鼠标悬停到元素上方时，添加样式
:focus:当元素获取焦点时，向该元素添加样式
border：用来设置元素的边框
四边设置：border：width值 style值 color值
单边设置：border-left border-right border-top border-bottom
样式单位：%：百分比 in：英寸 cm：厘米
mm:毫米 pt 磅（1pt=1/72 in）
Px像素 1em 等于当前字体尺寸
Overflow：当内容溢出元素边框时
Visible 不裁剪内容，可显示在内容框外
Hidden 裁剪内容，不提供滚动机制
Scroll 裁剪内容，提供滚动机制
Auto 如溢出，提供滚动
JavaScript
什么是javaScript？
嵌入在HTML中在浏览器中的脚本语言，具有与java和C语言类似的语言，一种网页的编程技术，用来向HTML页面添加交互行为，直接嵌入HTML页面，由浏览器解释执行代码，不进行预编译
特点：可以使用任何文本工具编译，由浏览器内置的JavaScript引擎执行代码
解析执行：事先不编译，逐行执行
基于对象：内置大量线程对象
使用：客户端的数据计算，客户端表单合法性验证，浏览器事件触发，网页特殊显示效果制作，服务器的异常数据提交
JavaScript程序的用法：
事件定义式：在时间定义时，直接写JavaScript；
嵌入式：在使用Script标签
文件调用式:代码位于单独的(.js)文件中，html页面引用js文件，在script标签中添加文件的地址（src=""）
JavaScript代码错误：
解释性代码，代码错误则页面中无效果，可以打开网页的"检查""错误控制台"来查看错误
JavaScript语法规范：
基本语法：由Unicode字符集编写
注释：单行：//注释内容 多行：/*注释内容*/
语句：表达式，关键字，运算符，大小写敏感，建议使用分号结尾一条语句
标识符和关键字：
标识符:不以数字开头的字母，数字，下划线和$组成
关键字：查看js手册
变量：使用关键字var声明变量，变量初始化使用"=="来赋值
没有初始化的变量自动取值为：undefined
变量无类型，统一使用var声明，变量所引用的数据有类型
JavaScript数据类型：
特殊类型：null： 空 undefined：未定义
内置对象：Number：数字 String：字符串 boolean：俩个值 true/false Array数组 function：函数
外部对象：window：浏览器对象 document：文档对象
自定义对象：Object：自定义对象
String类型:
由Unicode字符，数字，标点符号组成的字符序列，直接量需要一对单/双引号括起
Number类型：
在JavaScript中不区分整型数值和浮点型数值，整型直接量：默认的整数直接量为十进制
Boolean类型：
仅有俩个值 true/false
数据类型转换：
①数据类型之间隐式转换
②转换函数：
·toString：所有数据类型均可以转换为String类型
·parseInt（）：强制转换为整数，如不能转换则出现NaN;
·parseFloat（）：强制转换为浮点数，不能转换会出现NaN;
·typeof：查看当前类型，返回String/Number/boolean/object/Function/undefined
·isNaN（）：判断被检测表达式转换后是否不是一个数，若不是数，则为true；否则为fasle
特殊数据类型：
Null：程序中无值/无对象，可以给一个变量赋值为null来清除内容
Undefined：声明变量，单位赋值/对象属性不存在
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 终于写完轮子一部分：tcp代理 了，记录一下
· 震惊！C++程序真的从main开始吗？99%的程序员都答错了
· 别再用vector＜bool＞了！Google高级工程师：这可能是STL最大的设计失误
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码？零基础破解AI编程运行原理