HTML基础知识2

快捷键!+tab    补全html5结构

1关键字

<meta name="keywords"  content="xxxxxxxxxxx">  关键字是给seo看的，  seo:搜索引擎优化

2网页描述

<meta  name="description"  content="xxxxx">    xxxx为网页描述

3网页重定向

<meta  http-equiv="refresh"  content="5"; http://www.baidu.com> 意思是5秒后跳转到百度这个网页

4链接外部样式表

<link rel="stylesheet"  href="1.css">链接1.css外部样式表

5设置icon图标

<link rel="icon" href="xxx.ico"> 设置xxx.ico这个图片为ico图标

6表格

展示数据，是对网页重构的一个有益补充。

格式：

<table>   表格

<tr>          行

<td></td> 列

<td></td>

<td></td>

</tr>

</table>

属性：

Border=”4”   边框

Width=”500”  宽度

Height=”300” 高

cellspacing=”12”    单元格与单元格的距离

cellpadding=”10”    内容距边框的距离

align=”left  | right  |  center” 

如果直接给表格用align=”center”  表格居中

如果给tr或者td使用  ，tr或者td内容居中

bgcolor=”yellow”    背景颜色

7表头和单元格合并

添加表头 

在table标签下添加<caption></caption>

colspan=”x” 合并同一行上的单元格         x表示多少个单元格

rowspan=”x”  合并同一列上的单元格       合并放在td中

8表格标题、边框颜色、内容垂直对齐

◆表格标题 <th></th>用法和td一样

标题的文字自动加粗水平居中对齐

◆边框颜色  bordercolor

◆垂直对齐方式   valign="top/middle/bottom" 上中下

9表单

表单的作用是收集信息

◆表单域

◆文本输入框
<input type="text" maxlength="6"  name="username" value="大前端">

maxlength="6"    限制输入字符长度

name="username"   输入框的名称

value="大前端"     将输入框的内容传给处理文件

◆密码输入框
<input type="password" name="pwd">

文本输入框的所有属性对密码输入框都有效

◆单选框
<input type="radio" name="gender" checked="checked">男

只有将name的值设置相同的时候，才能实现单选效果。

checked=”checked” 设置默认选择项

◆下拉列表

<select>

<option>下拉列表选项</option>

<option>下拉列表选项</option>

</select>

属性：

Multiple=”multiple”  将下拉列表设置为多选项

Selected=”selected”  设置默认选中项目

对下拉列表进行分组

<optgroup Label=”分组名称” ></optgroup>。

◆多选框

◆多行文本框

<textarea cols="100" rows="10"></textarea>

Cols  控制输入字符的长度。

Rows  控制输入的行数

◆文件上传控件<input type="file">

◆文件提交按钮

<input type="submit">

可以实现信息提交功能

◆普通按钮

<input type="button" value="普通按钮">不能提交信息，配合JS使用

◆图片按钮<input type="image" src="按钮.jpg">图片按钮可实现信息提交功能

◆重置按钮<input type="reset">