2021-11-17（前端复习）

前端

一、HTML元素

1、基本标签

（1）行内元素：（b、strong、i、u、h1、hr、span、a）

（2）块元素：（div、p）

（3）超链接元素：<a href="网址">内容</a>（去除下划线：text-decoration:none（锚点））

（4）列表元素：有序列表（<ol><li>内容</li><li>内容</li><li>内容</li></ol>）

                              无序列表（<ul><li>内容</li><li>内容</li><li>内容</li></ul>）

（5）img、audio、video、

2、表格

<table>

       <tr >

            <td >内容</td>

            <th>内容</th>

      </tr>

</table>

3、表单

<form action="数据提交地址" method="post/get">

      <input type="text" name=""/>文本框

      <input type="password" name=""/>密码框

      <input type="radio" value="" name=""/>单选框

      <input type="checkbox" value="" name=""/>多选框

      <select name=""><option value=""></option><option value=""></option></select>

      <textarea cols="50" rows="3"></textarea>文本域

      <input type="file" name=""/>文件上传

      <input type="hidden" name=""/>隐藏框

      <input type="submit" value="提交"/>提交框

      <input type="button" value="按钮名"/>按钮

</form>

二、CSS样式

1、引入方式

（1）内联：元素中

（2）内部：style标签中

（3）外部：link标签引入

2、选择器

（1）基本选择器【元素选择器（p{}）、类选择器（.class{}）、id选择器（#{}）】

（2）组合选择器【组合选择器（元素选择器类选择器{}）、选择器组（基本选择器，基本选择器{}）、后代选择器（父类或祖类元素 子类元素{}）、伪类选择器】

（3）字体、颜色、背景、文本

（4）盒子模型

border：边框  border:宽度、类型、颜色

margin：外边距 （当前元素与父元素或其他元素之间距离）（上右下左）

padding：内边距（当前元素与内容之间距离）padding：上边距 右边距 下边距 左边距

3、定位方式

（1）流定位

（2）相对定位（以原位置为参考点，上下左右小幅度移动position:relative）

（3）绝对定位（以有相对定位属性的父或祖元素为参考点，上下左右大幅度移动position:absolute）

（4）固定定位（固定在页面某个位置，以body为参考点position:fixed）

（5）层叠

三、JS

1、字符串对象、数组对象、日期对象、数学对象

2、DOM、BOM

3、history、location、window（弹出框、定时、窗口打开、窗口关闭）

4、document【getElementById（ID）、getElementByName（Name）、getElementByTagName（TagName）】

5、form元素校验

<form action="return 校验方法()" method="post"></form>

<script>function 校验方法(){return true;return false}</script>

6、事件

• 鼠标点击事件（onclick、ondbclick）
• 鼠标移动事件（onmouseover、onmouseout）
• 加载与卸载事件（onload、onunload）
• 聚焦与离焦事件（onfocus、onblur）
• 键盘事件（onkeydown、onkeyup、onkeypress）
• 提交与重置事件（onsubmit、reset）
• 选择与改变事件（onselect、onchange）