黑马程序员pink老师前端入门教程，零基础必看的h5(html5)+css3+移
网页组成部分：HTML结构，CSS表现，JS行为
lang为语言类型，en为英语，zh-CN为中文，fr法语
charset 意为字符集 UTF-8意为万国码
标题标签(双标签)：<h1>-<h6> 重要性/字号：h1>h2>h3>h4>h5>h6
段落标签(双标签)：<p>
换行标签(单标签)：<br/>
文本格式化标签(双标签)：加粗：<strong>(更加推荐)，<b> 倾斜：<em>(更加推荐),<i> 下划线：<ins>(更加推荐),<u>,删除线：<del>(更加推荐),<s>
<div>(双标签)(独占一行)<span>(双标签)(一行可以放多个<span>)没有语义，是一个盒子，修饰内容；
图像标签单标签：<img src=""/>src是<img>的必须属性，用于指定图像文字的路径和文件名，alt:图像不能显示，显示文字，title：鼠标放到图像上，显示文字，width：设置图像的宽，height：设置图像的高，border:设置图像的边框粗细
上一级路径:../ 下一级：/（上下级为相对位置）
超链接标签：
<a>(双标签)语法格式：<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>（_self意为默认值，_blank为在新窗口打开方式，两个都为打开方式）
内部链接只需href=”文件名“，空连接：<a href="#">
下载链接：地址为文件或压缩包
锚点链接（快速跳到本页面的某一个位置）：1.href值为#名字的形式；2.找到目标位置标签，里面添加一个id属性=刚才的名字。样例：<a href="#two">第二集</a> <h3 id="two">第二集介绍</h3>
注释标签： <!-- 添加注释 -->（vscode快捷键：CTRL+/？）
特殊字符：空格：  大于号：> 小于号：< 和号（&）：& 人民币（￥）：¥ 版权（©）：© 注册商标（™）：® 摄氏度：° 正负号：± 乘号：× 除号：÷ 平方二：²平方三：³
表格基本语法：
<table>
<tr>//tr表示行
<td>单元格内的文字</td>//td为单元格
...
</tr>
...
</table>
表头标签(双标签)：<th>(文字加粗，居中)
表格属性：
属性名 属性值 描述
align left,center,right 规定表格相对周围元素的对齐方式
border 1或“” 规定表格单元是否拥有边框，默认为“”，表示没有边框
cellpadding 像素值 规定单元边沿与其内容之间的空白，默认为1像素
cellspacing 像素值 规定单元格之间的空白，默认为2像素
width 像素值或百分比 规定表格的宽度
表结构标签：thead表头部区域，tbody表主体部分（两个都为双标签）
合并单元格：
方式：跨行合并：rowspan=“合并单元格的个数” ，跨列合并：colspan=“合并单元格的个数”
目标单元格：跨行，最上侧单元格为目标单元格，写合并代码；跨列，最左侧单元格为目标单元格，写合并代码
列表(用来布局)标签：
1.无序列表：<ul>(双标签) <li>(双标签) 例子：<ul> <li>列名</li>...</ul>
2.有序列表：<ol>(双标签) <li>(双标签) 例子：<ol> <li>列名</li>...</ol>
3.自定义列表：<dl>(双标签) <dt>(双标签) <dd>(双标签) 例子：<dl><dt>名词1</dt><dd>名词解释1</dd><dd>名词解释2</dd>...</dl>
表单标签：
1.表单域(用于定义表单域，以实现用户信息的收集和传递)：<form>(双标签)(form会将他范围内的表单元素信息提供交给服务器) 例子：<form action="url地址" method=“提交方式” name=“表单域名称”>各种表单元素控件</form>
属性 属性值 作用
action url地址 用于指定接收并处理表单数据的服务器程序的url地址
method get/post 用于设置表单数据提交方式，其取值为get或post
name 名称 用于指定表单的名称，以区分同一个页面中的多个表单域
2.表单元素（表单控件）：
1）<input>（输入元素）（单标签） 例子<input type="属性值" />
type属性值 描述
button 定义可点击按钮
checkbox 定义复选框
file 定义输入字段和“浏览”按钮，供文件上传
hidden 定义隐藏的输入字段
image 定义图像形式的提交按钮
password 定义密码字段，该字段中的字符被掩码
radio 定义单选按钮
reset 定义重复按钮，重置按钮会清除表单中的所有数据
submit 定义提交按钮，提交按钮会将表单数据发送给服务器
text 定义单行的输入字段，用户可以在其中输入文本，默认宽度为20个字符
除了type意外，<input>还有其他属性：
属性 属性值 描述
name 由用户自己定义 定义input元素的名称
value 由用户自己定义 规定input元素的值
checked checked 规定此input元素首次加载时应被选中
maxlength 正整数 规定输入字段中的字符的最大长度
2）<label>(双标签)(用户界面中某个元素的说明) 例子：<label for="sex">男</label><input type="radio" name="sex" id="sex" />
3)下拉表单<select><option>(双标签) 例子：<select> <option>选项1</option>...</select>（在<option>中定义selected=“selected”是，当前项为默认项）
3.文本域标签<textarea>(双标签) 例子：<textarea rows="n" cols="m"></textarea>
CSS
CSS规则由两个主要部分构成，选择器以及一条或多条声明
h1{color：red； font-size：25px；}
| | | | |
选择器 属性 值 属性 值
css写在<head>中
<style>(双标签)（放在）<head>中
例子:<head><style>p{color:red;}</style></head>
CSS基础选择器包括标签选择器，类选择器，id选择器，通配符选择器
标签选择器：语法：标签名 {属性1：属性值；属性2：属性值...}
类选择器：语法 ：<标签 class=“属性值”></标签>例：:<head><style>.red {color:red;}</style></head><div class="red"> 变红色</div>
类选择器口诀：样式点定义，结构类（class）调用，一个或多个，开发最常用
id选择器：id选择器以“#”来定义 语法：#id名 { 属性1：属性值1；属性2：属性值2；...}例： <head><style>#red {color:red;}</style></head><div id="red"> 变红色</div>
id选择器注意：id属性只能在每个HTML文档中出现一次；口诀：样式#定义，结构id调用，只能调用一次，别人切勿使用
通配符选择器：通配符选择器用“*”定义 语法： *{属性1：属性值1；属性2：属性值2；...}
CSS字体属性：
1.字体系列：
字体类型：font-family 例：<head><style>h2 {font-family: "微软雅黑";}</style></head><h2> 变红色</h2>
字体大小：font-size 例：<head><style>h2 {font-size: "20px";}</style></head><h2> 变红色</h2>
字体粗细：font-weight 使用方法与类选择器一样 属性值：normal不加粗，blod加粗，100-900，400等于normal，700等于blod
字体体样式：font-style 使用方法与字体类型一样 属性值：normal浏览器表示标准字体样式，italic浏览器显示斜体字体样式
字体符合属性： font: font-style font-weight font-size/line-height font-family 例：div{font: italic 700 "微软雅黑"}（不需要设置的属性可以省略，但必须保留font-size和font-family属性）
字体颜色：例：div{color：red；} 表示 预定义的颜色值，十六进制，如#FF0000，#FF6600；rgb代码如rgb（255，0，0），rgb（100%，0%，0%）
对齐文本：text-align（使用方法与类选择器一样），
装饰文本：text-decoration（使用方法与类选择器一样）
属性 描述
none 默认，没有修饰线
underline 下划线
overline 上划线
line-through 删除线
文本缩进：text-indent（使用方法与类选择器一样） em：当前元素1个文字的大小
文本行距：text-height（使用方法与类选择器一样） 属性值单位为px
CSS引入方式：
行内样式表（行内式）<style>(双标签)
内部样式表（嵌入式）：先创建.css文件，后用<link>关联（<link>格式：<link rel="stylesheet"href="外部样式表文件名.css" type="text/css">）
外部样式表（链接式）：直接在标签内部写
CSS复合选择器：
1.常用选择器：后代选择器，子选择器，并集选择器，伪类选择器
1）后代选择器：语法：元素1 元素2{样式声明}
