一、知识点汇总
T1
1. HTML语言，全称为超文本标记语言，作用：用于制作精美网页。其扩展名为：.html或 .htm。
标签，使用"<"、">"括起来，作用：用于标识和分割。
2. HTML中常用的特殊字符对应的转义码：
1）空格符     
2）大于      >
3）小于      <
4）版权符    ©
注意：  （1）转义码是以“&”开头；
（2）并以分号“;”结束；
（3）“&”与转义码间不能有空格；
（4）区分大小写。
3. HTML的基本标签
（1）标题标签<hx>分为六级，分为：<h1>~<h6>，最大级为<h1>，最小为<h6>。特点：加粗显示，并占据一行。
（2）段落标签<p>，作用：可以设置段落的开始和结束。
（3）换行标签<br/>，作用：专门用来分割内容的功能。
段落标签与换行标签的区别：
1）<br/>只是换了一行，没有行距。
2）<p>换了一个段落，上下有行距。
（4）预排版标记<pre>
（5）文本格式化标签
1）<b>标签，功能：使文字加粗显示；
2）<i>标签，功能：使文字斜体显示；
3）<u>标签，功能：是文字带下划线显示；
4）<sup>标签，功能：使其内部文字比前方的文字高一些，并以更小的字体显示；
5）<sub>标签，功能：使其内部文字比前方的文字低一些，并以更小的字体显示；
（6）设置文字字体标签<font>
字体大小属性：size，一共有七个字号，默认size="3"，最大为size="7"。
字体属性：face
字体颜属性：color，单位为px像素点，百分比%。
（7）插入横线<hr/>
横线长度属性：width=""
横线高度属性：size=""，单位为px像素点。
水平对齐方式：align，其属性值为：left（左对齐）、right（右对齐）、center（居中对齐）
（8）插入图片<img />
指定图片路径属性：src，
图片说明文字：alt，
设置图片大小：width（宽度）、height（高度）
（9）添加滚动文字<marquee>
作用：让文字在网页上动态滚动。
默认时，文字从右到左循环滚动。
方向：direction，其属性值为：left（从右向左）、right（从左向右）、top（从下至上）、down（从上之下）
方式：behavior，其属性值为：scroll（一遍一遍走）、slide（只走一次就停）、alternate（从右到左，再从左到右）
循环：loop，loop="#"，#代表循环的次数，负数将无限循环。
速度：scrollamount，
延时：scrolldelay
（10）列表
（1）无序列表（ul）
<ul type="circle"><li></li></ul>
项目符号：disc（实心圆点），默认；square（空心圆点）；circle（空心圆点）
（2）有序列表（ol）
<ol type="A"><li></li></ol>
项目符号：1（数字），默认；A（大写英文字母）；a（小写英文字母）、I（大写罗马数字）
、i（小写罗马数字）
（3）自定义列表
T2
一. 表格<table>
1.表格由行和单元格组成。
（1）行<tr></tr>，作用：制作行区域
（2）单元格<td></td>，一个单元格一个内容
格式：
<table>
<tr>
<td>单元格内容</td>
</tr>
</table>
2. 表格的表头<th></th>，特点：内容加粗居中显示
3. 表格的标题<caption></caption>，特点：以表格居中显示
4.设置表格的边框：border
5. 表格的合并
（1）合并单元格：colspan=""
（2）合并行：      rowspan=""
6. 水平对齐方式：align，其属性值为：left、right、center；垂直对齐方式：valign，其属性值为：top（垂直顶部对齐）、middle（垂直中部对齐）、bottom（垂直底部对齐）。
7. 设置表格背景颜gcolor；设置表格大小：width（宽度），height（高度）。
8.设置单元格与单元格之间的距离：cellspacing；设置表格内容与单元格之间的距离：cellpadding。
二、表单<form>
1. 表单是用于注册页面，提交数据的。
格式：
<form name="表单名" method="传送方式" action="表单提交地址"></form>
传送方式：get、post
2. 表单内容分为：输入类控件和菜单列表类控件。
输入类控件：需要用户输入的。
格式：
<input type="控件类型" name="控件名称" />
控件类型：
文本框：text
密码：password
单选按钮：radio
多选框：checkbox
提交按钮：submit
重置按钮：reset
普通按钮：button
文件域：file
菜单列表类控件：供用户查看选择的。
格式：
<select name="名称" size="显示可见行数" multiple="multiple">
<option value="">...</option>
</select>
3. 文本域<textarea>
作用：用于创建多行文本输入控件。
格式：
<textarea name="元素名称" cols="宽度" rows="行数"></textarea>
T3
1. CSS全称为层叠样式表，即将所有的样式叠加在一起，最终的形成的样式。
2. 根据CSS代码分布不同可分为：行内样式表、内部样式表、外部样式表。
行内样式表：<；标签 >
内部样式表：<head><style type="text/css"></style></head>
外部样式表：CSS外部样式文件，以后缀为：.css的文件
css外部样式表代码
使用: <link href="css文件路径" rel="stylesheet" type="text/css" />
href：css文件路径；
rel：关系；
type：类型
3. 选择分类：
（1）元素选择器
标签名{ 样式属性：属性值;... }
（2）组选择器
标签名1 , 标签名2{ 样式属性：属性值;... }
注意：HTML标签名之间使用英文的分号“,”分隔。
（3）包含选择器
标签名1  标签名2{ 样式属性：属性值;... }
注意：HTML标签名之间使用空格符分隔。
（4）CLASS选择器
.选择器名称{ 样式属性：属性值;... }
注意：以圆点“.”开头，“.”代表是类选择器。
（5
）ID选择器
#选择器名称{ 样式属性：属性值;... }
注意：以“#”开头，“#”代表是ID选择器。
（6）通配选择器
*{ 样式属性：属性值;... }
注意：“*”代表网页所有的标签元素。
4. CSS样式的优先级
行内样式表 > 内部样式表 > 外部样式表
T4
1. CSS网页布局：由所有网页的内容、结构、表现组成。
2.DIV跟其它标签一样，也是一个HTML标签，是一个容器，也是一个块级元素；
作用：用于存放网页内容、布局网页。
3. 行内元素转块级元素
display:block;
4. div的使用
（1）并列使用div
<div></div>
<div></div>
（2）嵌套使用div
<div>
<div>...</div>
</div>
5. 盒子模型
四个区域：内容、边框（border）、外边距（margin）、内边距（padding）。
内容：盒子里边的东西。
边框：
border：大小  颜  样式; 如：border:1px #FF00FF inset;
外边距：
margin：上 左 下 右; 如：margin: 10px 20px 30px 40px;---对应上右下左
margin-top、margin-right、margin-bottom、margin-left
内边距：
padding：上 左 下 右; 如：padding: 10px 20px 30px 40px;---对应上右下左
padding-top、padding-right、padding-bottom、padding-left
盒子的总宽度=左内边距+边框+内容+右内边距+边框
6. 浮动定位
position
三种定位：相对定位、绝对定位、固定定位（不讲）
相对定位：相对定位是相对于元素在文档中的初始位置；
position:relative;
top:
left:
注意：相对定位会保留原来的位置。
绝对定位：
position:absolute;
top:
left:
注意：绝对定位会覆盖内容，不保留原来的位置。
7. 浮动
float
浮动的属性值为：left、right
8. 清空浮动
clear
清空浮动的属性为：left、right、both
clear:both;  清空左右浮动
T5
一、CSS布局常用技巧
1.列固定宽度
将元素对象宽度设置为固定值px
固定宽度：width:300px;
2.列自适应宽度
将元素对象宽度从固定值px单位改为百分比%
固定宽度：width:300px;
改为：
自适应宽度：width:100%;
优点：元素对象会随着浏览扩大或者缩小而跟着浏览器窗口自适应当前显示的比例。
3.列固定宽度居中
将元素对象设置固定宽度，采用margin，上、下边距相同，左右边距自适应auto。
固定宽度：width:300px;
内容居中：margin:0 auto;
二、改变项目符号样式
1.将HTML列表的项目符号替换成图片
技巧1：
list-style-image:url(图片路径);
2.去掉HTML列表项目符号
技巧2:
list-style:none;
3.鼠标移动到超链接a标签内容上时，触发的效果
技巧3：
a:hover{样式属性：属性值;...}
4.横向图文列表
技巧：先浮动图片，再去掉列表样式
float:left;
list-style:none;
5.浮动后父容器高度自适应
当列表内容浮
动以后，内容会脱离父容器，为了让列表内容装进父容器，此时需要让高度自适应
技巧：
overflow:auto; 让高度自适应。
二、简答题（强调，这五道题分量很重）
1. HTML的语法结构
答： <html>
<head>
<title>标题</title>
</head>
<body>
</body>
</html>
2. HTML的特点
答： （1）浏览器解释速度快；
（2）格式优美；
（3）无任何垃圾代码产生，加快了网页传输速率。
3. 简述内容、结构、表现
答： 内容：网页页面实际要传达的真正信息。
结构：网页主体部分再加上结构化标签所组成的。
表现：赋予网页的一种样式，就是看到的样子。
4. 什么表单？表单的提交方式分为几种？简述它们分别有什么特点。
答： （1）表单是用于网页注册信息的。
（2）表单提交方式分为2种，get和post。
（3）get：
1）提交的数据加在URL（地址）后面；
2）数据量最大不能超过2kb;
3）速度快，不安全。
post：
1）数据和地址分开发送至服务器；
2）数据量不受限制；
3）速度比get慢，较安全。
5. DIV+CSS的优势
（1）表现和内容相分离；
（2）提高搜索引擎对网页的索引效率；
（3）代码简洁，提高页面浏览器速度；
（4）易于维护和改版。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。