B/S架构
B是browser（浏览器）用户使用的所有客户端（部分手机app，小程序），我们都可以把它视为浏览器，S是server（服务器）。浏览器发出请求，通过http等互联网协议，发送至S端服务器，S端把网页文件发送给前端，B端浏览器收到文件后，浏览器解析成图形界面，可供用户操作。
HTML基础标签
<!DOCTYPE html>
<!-- html5,html语言的第五个版本
超文本标记语言
一处发布，到处可以查看
上面是HTML5的标识，告诉浏览器这是按照
HTML5标准写的代码
-->
<html>
<head>
<!-- 头部，页面背景上的设置 -->
<meta charset="utf-8">
<!-- meta元标签 -->
<!-- charset编码格式 -->
<!-- GB-2312国家标准
GBK国家标准扩展包 -->
<title>Hello，World！</title>
</head>
<body>
<div>无实意标签</div>
<p>段落</p>
<span>无实意标签</span>
<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20180826%2F56195667faad4b97be4b66f55a9b1e9d.jpeg&refer=http%3A%2F%2F5b0988e595225.cdn.sohucs.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1638327866&t=063a07f5b16adc69b0d00fc04737bfbb">
<ul type="circle">
<!-- 无序列表 -->
<li>aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li>
</ul>
<ol type="i">
<li>aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li><li>aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li><li>aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li><li>aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li><li>aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li>
</ol>
<input type="text" name="">
<input type="number" name="">
<input type="password" name="">
<!-- 单选框 -->
性别：
<input type="radio" name="gender">男
<input type="radio" name="gender">女
<br>
<!-- 复选框 -->
<input type="checkbox" name="">
<a href="https://www.baidu.com">
百度一下
</a>
<h1>1级标题</h1>
<h2>2级标题</h2>
<h3>3级标题</h3>
<h4>4级标题</h4>
<h5>5级标题</h5>
<h6>6级标题</h6>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- css层叠样式表
特点：
1.继承性
2.层叠性，可被覆盖
-->
<link rel="stylesheet" type="text/css" href="css/main.css">
<!-- 外部样式表/链入样式表 -->
<style type="text/css">
/*头部样式表*/
ul{
background: lightgreen;
}
li{
color: blue;
}
</style>
</head>
<body>
<div style="width: 100px;
height: 100px;
background-color: lightblue;">
<!-- 行内样式表，极差，不允许使用 -->
</div>
<ul>
<li>aaaaa</li>
<li class="xiaoHong">bbbbbb</li>
<li id="xiaoMing">cccccc</li>
<li class="xiaoHong">dddddd</li>
<li>eeeeee</li>
</ul>
</body>
</html>
li{
color: red;
/*标签选择器*/
}
#xiaoMing{
color: pink;
}
/*id选择器，id唯一且不重复*/
.xiaoHong{
color: lightblue;
}
/*class类名选择器*/
/*css优先级*/
/*1.后来者居上，越往后越说了算*/
2.行内样式>头部样式>=外部样式
3.越精确越说了算id>class>标签
4. ！important优先级最最高，但是不到最迫不得已的时候不要用。
驼峰命名法
xiaoming小驼峰命名法，xiaoMing大驼峰命名法，xiao_ming 下划线命名法。
··表现与结构分离··
表现：css
结构：html
width:宽度
height:高度
background:背景(是一个符合属性)
HTML 的路径
绝对路径：指目录下的绝对位置，可以直接找到目标位置，通常从磁盘开始的路径，即完整描述文件位置的路径为绝对路径。主要形式有：
网址：https://www.baidu.com
本地文件路径：D:/web前端学习/biaoqian.html
相对路径：指由当前文件所在的路径引起其它文件的路径关系，（以当前的文件为参照物，去寻找其他文件的一种路径方式，在开发项目中经常使用）
同级目录：直接写文件名信息
下一级目录：/imgs/1.jpg
返回上一级目录：../imgs/1.jpg
返回多层上级目录：../a/imgs/1.jpg