HTML 基础语法2

• 超链接标签<a>－－重点知识－－重点

1. HTML 使用超链接与网络上的另外一个文档相连。<a>标签 用于在HTML中创建超链接。成对出现，开始标签和结束标签之间的文字被作为链接来显示。
2. <a>标签的属性有：
3. （1）href ：用于定位需要连接的文档；
4. （2）target ：定义被链接的文档在何处显示；   ⚠ target 常用的两个值：1. _self : 在本窗口打开链接；  _blank ：在一个新窗口打开链接。
5. （3）title ：定义鼠标停留在链接上提示信息；

例：<a href ＝”跳转路径，即跳转到这个路径里面”> 文字、图片</a>    点击文字或者图片跳转到相应的路径界面去。

⚠️ 超链接 一定要注意路径的问题。

• 列表

1. 有序列表 :  ol/li*5
2. 无需列表 :  ul/li*3

• 表格<table>

1. 表格一般主要用于展示数据。但在网页设计中，主要用于布局。
2. HTML中的表格由 <table> 标签创建，行 由 <tr> 标签定义，列 由 <td> 标签来定义。表头使用 <th> 标签 来定义。<td> 元素中的内容为表格数据，可以包含文字、图片、列表、段落、水平线、表格等任何元素。
3. 表格支持嵌套。
4. <table> 标签的常用的属性：

（1）cellspacing :定义表格的 间距(单元格之间)；

（2）cellpadding:定义表格的 边距（内容和单元格之间）；

（3）width :定义表格的 宽度；

（4）height ：定义表格的 高度；

（5）border ：定义表格的 边框粗细；

（6）align ：定义表格在页面中的 水平对齐方式；

• 表单（例如：帐号登陆界面、注册界面等）－－主要负责数据采集功能，表单是人和电脑交互的通道。

1. 一个表单有两部分组成：表单标签和表单域。⚠️表单域是嵌入在表单标签里面的。
2. 表单标签：这里面包含了处理表单数据所用的 CGI 程序的URL 及 数据提交到服务器的方法。
3. 表单域：包含了单行文本输入框、密码框、隐藏框、多行文本输入框、复选框、单选框、下拉选择框和文件上传框、表单按钮等。
4. 表单按钮：包括提交按钮、重置（复位）按钮和一般按钮；用于将话剧传送到服务器上的CGI 脚本 或者取消输入，还可以用表单按钮控制其他定义了处理脚本的处理工作。

表单区域代码：

         表单标签:它是双标签，用于定义表单名字、提交数据的目的地 和 提交的方式等信息。

<form  name=“form1” action=“register.aspx” method=“post”>

…..

</form>

     表单要先写表单区域，表单的元素放在表单区域里面。<form></form>组成一个表单区域，一个页面可以有多个表单区域。⚠️表单不支持嵌套，⚠️ 表单命名是一定不要重名。

⚠️post 提交方式 和get 提交方式的区别：get 提交方式（地址栏提交），网址会写到更多的信息。要传递带有重要信息的消息时，用post提交方式。

（1）单行文本输入框

          用<input>标签描述，单标签。例：登录名  <input name=“username” type=“text” >  。name：指定输入框的名字，自行定义，用英文即可，⚠️不要使用关键字； type属性： 单行文本输入框的 type 固定为 text。

（2）密码输入框

          用<input>标签描述，单标签。例：密码：  <input name=“password”   type=“password” >  。name：指定输入框的名字，自行定义，用英文即可，⚠️不要使用关键字； type属性： 密码输入框的 type 固定为password。

（3）单选框

          单选框一次只能一个选项，用<input>标签面熟，单选框使用时至少需要 2 个以上的 input 标签，并且它们的 name 属性相同， 即一组的名称相同，其中每一个input 构成一个选项。例：

篮球<input name="honey"  type="radio" value="1">

排球< input name= "honey"  type= "radio" value= "0">

⚠️：name名称一样，类型 type= "radio" ， value的值是我们做出选择后要传送的值。

（4）复选框

       复选框的属性：

     1) name :指定复选框的名字，自定义，用英文即可；

     2) type : 固定类型为 checkbox；

     3) value : 指定该选项的值；

         4) checked : 该属性固定值为 checked ，表示选中该选项,即默认该选项是选中状态。

（5）下拉单选框－－两个标签组成

     一次能选择一个选项，用 <select > 标签描述，每一个选项用子标签 <option> 描述。例：

< select  name= "select"  id= "select" >

    < option  value= "010" > 傣族 </ option >

    < option  value= “010" selected > 汉族 </ option >

    < option   value= "020" >彝族</ option >

</select>

  <select > 属性：

     1）name ：自定义，英文即可

 <option>属性：

     1）value ： 指定该选项的值

          2）selected: 默认该选项是选中状态 

   （6）多行文本输入框

          用于输入大量的文字信息，用　<textarea> 标签描述，它是双标签。例：

          多行文本的属性：

          1）name ：自定义，英文即可

          2）rows ：文本框的行数

          3）clos ：文本框的列数

    （7）文件上传

          文件上传标签：<input type=“file”>。 文件上传标签<input> ，type类型为 file。 这只是一个上传按钮，要想真正的上传，后台必须写有一定的逻辑代码来实现。

     （8）提交按钮

           用于将表单数据提交给 action 属性指定的地址进行处理。它用 <input> 标签描述，单标签。

           提交按钮的属性：

           1）name ： 自定义，英文即可

           2）type ：固定为 submit。点击按钮，跳转到 action 中指定的地址信息。

           3）value ： 指定按钮上显示的数字。

     （9）重置按钮

          区别于提交按钮的地方在于：type 的类型是 reset。