html基础二

meta标签和link标签

Charset 编码
Ascll
Ansi
Unicode
Gbk
Gb2312
Big5
Utf-8 通用字符集

表格行与列

表格

展示数据
< table> 表格
< tr> 行
< td>< /td> 列
< td>< /td>
< td>< /td>
< /tr>
< /table>

◆属性：
Border=”1” 边框
Width=”500” 宽度
Height=”300” 高
cellspacing=”2” 单元格与单元格的距离
cellpadding=”2” 内容距边框的距离
align=”left | right | center”
如果直接给表格用align=”center” 表格居中
如果给tr或者td使用 ，tr或者td内容居中。
bgcolor=”red” 背景颜色。

表格的标准结构

< table>
< thead>
< tr>
< td>< /td>
< td>< /td>
< /tr>
</ thead>
< tbody>
< tr>
< td>< /td>
< td>< /td>
< /tr>
< /tbody>
< tfoot>
< tr>
< td>< /td>
< td>< /td>
< /tr>
< /tfoot>
< /table>

表头和单元格合并

表头 < caption>< /caption>
colspan=”2” 合并同一行上的单元格
rowspan=”2” 合并同一列上的单元格

表格之标题，内容垂直对齐方式、边框颜色

表格标题

< th></ th>用法和td一样
标题的文字自动加粗水平居中对齐

边框颜色

bordercolor=“red”

内容垂直对齐方式

Valign=”top | middle | bottom”

表单

表单的作用是收集信息。

表单域

属性：action:处理信息
Method=”get | post”
Get通过地址栏提供（传输）信息，安全性差。
Post 通过1.php来处理信息，安全性高。

文本输入框

maxlength=“6” 限制输入字符长度
readonly=”readonly” 将输入框设置为只读状态（不能编辑）
disabled=“disabled” 输入框未激活状态
name=“username” 输入框的名称
value=“大前端” 将输入框的内容传给处理文件

密码输入框

★注意：文本输入框的所有属性对密码输入框都有效。

单选框

只有将name的值设置相同的时候，才能实现单选效果。
checked=”checked” 设置默认选择项。

下拉列表

< select>
< option>下拉列表选项< /option>
< option>下拉列表选项< /option>
< /select>
属性：
Multiple=”multiple” 将下拉列表设置为多选项
Selected=”selected” 设置默认选中项目
< optgroup>< /optgroup> 对下拉列表进行分组。
Label=”” 分组名称。

多选框

Checked=”checked” 设置默认选中项

多行文本框

Cols 控制输入字符的长度。
Rows 控制输入的行数

文件上传控件

file

文件提交按钮

可以实现信息提交功能

普通按钮

不能提交信息，配合JS使用。

图片按钮

图片按钮可实现信息提交功能

重置按钮

将信息重置到默认状态

表单信息分组

< fieldset>< /fieldset> 对表单信息分组
< legend>< /legend> 表单信息分组名称

标签语义化

好的语义化的网站标准就是去掉样式表文件之后，结构依然很清晰。
标签语义化概念：根据内容的结构化（内容语义化），选择合适的标签（代码语义化）

-标签语义化意义：
1:网页结构合理
2:有利于seo:和搜索引擎建立良好沟通，有了良好的结构和语 义你的网页内容自然容易被搜索引擎抓取；
3:方便其他设备解析（如屏幕阅读器、盲人阅读器、移动设备）
4:便于团队开发和维护

1：尽可能少的使用无语义的标签div和span；

2：在语义不明显时，既可以使用div或者p时，尽量用p, 因为p在默认情况下有上下间距，对兼容特殊终端有利；

3：不要使用纯样式标签，如：b、font、u等，改用css设置。

4：需要强调的文本，可以包含在strong或者em标签中strong默认样式是加粗（不要用b），em是斜体（不用i）；