1.web主要分为三个部分,分别是HTML(用于勾勒网页的结构)、CSS(用于美化网页)、JS(用于实现动态的功能)。要想写好JS必须先了解HTML和CSS。
2.HTML:超文本标记语言,用来设计网页结构,由浏览器解释执行,以.html或.htm后缀结尾,而且可以在HTML上嵌套其他语言。本文的标签只写了前标签,后标签没写,但是标签都是成对的。HTML与XML的区别在于:
1)XML:可扩展标记语言,用于存储或运输数据
---标签可扩展
---属性可扩展
---标签的嵌套可扩展
2)HTML:超文本标记语言,用于显示数据,可以看成是固定的XML
---标签固定
---属性固定
---元素(标签)嵌套关系固定
3.<!DOCTYPE>:用于声明HTML的版本,不同版本有不同的方式,h5的方式是<!doctype html>
4.HTML的元素:
1)<meta>:在<head>元素下,用于声明编码(charset属性)
2)标题元素:从h1-h6,h1字体最大
3)段落元素:<p>,提供一个结构化的文本方式
4)列表元素:<ol>:有序列表,<ul>:无序列表,二者可以随意嵌套
5)分区元素:<div>:块分区,<span>:行内分区
5.块级元素和行内元素的区别:
1)块级元素:
---独立成行,默认垂直分布
---占据一个矩形区域,有宽高
---块级元素会影响页面布局
---主要的块级元素有:<p>、<div>、<hn>、<ol>、<ul>
2)行内元素:
---不独立成行,默认横向布局
---没有宽高,不占据一个矩形区域
---不影响页面布局,只用来修饰几个字
---主要的行内元素有:<span>、<i>、<u>、<b>
6.行内元素:
1)<i>、<em>:用来使文字倾斜
2)<b>:加粗字体
3)<strong>:加重文字
4)<del>:给文字加删除线
5)<u>:给文字加下划线
6)默认情况下,多个换行符、多个空格符、多个制表符都只显示为一个空格符,可用<br>换行
7.图像元素:<img>,必须属性src(图片路径,有绝对路径和相对路径),其他常用属性width、height
8.超链接元素:<a>,必须属性href(URL路径),target属性(打开方式,可取值_blank:空白页打开链接,_self:当前页打开链接)
---锚点,用于回到文档的某处,语法:
<a name="a1">锚点</a>
<a href="#a1">回到锚点</a>
---若#后不加name,那么默认回到顶点
9.表格:
1)<table>:属性有width、height、border、align、cellpadding(单元格边框与内容的距离)、cellspacing(单元格之间的距离)
2)<tr>:表示行,属性有align、valign
3)<td>:表示列,属性有align、valign、colspan(跨列)、rowspan(跨行)
4)<thead>、<tbody>、<tfoot>用于给表格分组
10.表单:用于显示、收集信息,并提交信息到服务器,有二元素:form和表单控件
1)<form>:提示此标签包含的内容是要提交给服务器的,主要属性有action(提交的URL)、method(提交方式)、enctype(编码方式)
2)表单控件:包括input元素、文本域、标签、下拉选
---input元素:包括文本框(type="text")、密码框(type="password"),主要属性value(输入任何文本)、maxlength(限制输入的最大字符数)、readonly(只读)
---input元素:单选框(type="radio")、复选框(type="checkbox"),主要属性value(文本)、name(用于分组,当单选的name属性一样时,将互相排斥)、checked(默认选中)
---input元素:按钮(type="submit"/type="reset"/type="button"),分别是提交、重置、普通按钮,主要属性value(按钮的名字)
---input元素:隐藏域(type="hidden"):隐藏信息
---input元素:文件选择框(type="filet"):上传文件
---文本域:相当于多行文本框,<textarea>文本</textarea>,主要属性cols(列数)、rows(行数)、readonly(只读)
---标签:<lable>,通过for属性,绑定input元素的ID,以达到点击此lable即点击该input的目的
---下拉选:语法
<select><option>文本</option><option>文本</option>...</select>