2-链接-meta-表格-表单

最新推荐文章于 2024-11-07 10:38:40 发布

佼人僚兮

最新推荐文章于 2024-11-07 10:38:40 发布

阅读量578

点赞数

分类专栏： HTML 文章标签： html 表单链接

本文链接：https://blog.csdn.net/ZacharyUE/article/details/51092882

版权

HTML 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

超级链接

1、语法格式：<a 属性=“值”>内容</a>，不能嵌套

2、常用属性：

Href：目标文件的地址URL，该URL可以是相对地址，也可以是绝对地址
Target：目标文件的显示窗口
- _blank：在新窗口中打开目标文件
- _self：在当前窗口中打开目标文件（默认），相当于“替换”操作
- _parent：在父级窗口来打开目标文件
- _top：在最顶级窗口来打开目标文件
Name：定义锚点链接的名称

绝对地址URL

1、远程的绝对地址：访问远程的文件，总是以http://域名，主机打头

2、本地的绝对地址（很少使用）：file:///

相对地址URL

1、当前文件和目标文件同级关系，直接写目标文件名

2、当前文件和目标文件所在的文件夹同级，写文件夹名/目标文件名

3、目标文件在上层目录，../（上一级）../../（上两级）

特殊链接

1、什么样的文件会出现下载提示？RAR、doc...

2、邮箱链接：mailto:

3、普通空链接：#

4、JS链接：JavaScript:window.close（）

HTML颜色表示

网页中的颜色有三种表示方法：

1、颜色单词：blue、green。。。

2、10进制表示：rgb(255,0,0) 不推荐使用，常用于CSS

3、16进制表示：#FF0000

锚点链接

锚点链接，是在一个网页的不同区域进行跳转。锚点可以理解为“定义记号”

步骤：

1、定义锚点（做个记号）<a name= “锚点名称”>无内容</a>

锚点名称命名规则：可以包含字母、数字、下划线，但以字母打头

2、跳转到锚点（记号）<a href= “文件名#锚点名称">内容</a>

<meta>标记

1、http-equiv属性

功能：模拟http协议文件头信息，当信息从服务器端传到客户端时，告诉浏览器如何正确的显示网页内容。
http-equiv属性一般要与content属性配合使用。content属性指定信息的详细参数。

（1）设置网页的字符集

（2）网页自动刷新

2、name属性

name属性主要用于设置网页的搜索关键字、版权信息、作者等。

（1）设置网页搜索关键字

（2）设置网页的描述信息

XHTML简介

传统的HTML开发的初衷是面向PC机的，而随着移动端的不断出现，HTML已经满足不了时长的需求了。 XHTML是新一代的HTML标注语言，目的是为了取代HTML。XHTML的标记与HTML一模一样，语法更严格，可扩展。

XHTML编写规范

所有标记和属性要全小写
单边标记必须关闭。如：<br>———><br />
所有的属性值都必须要加引号。
所有的属性都必须有值。如<hr noshade>———><hr noshade=“noshade” />
标记之间要顺序嵌套，外层套内层，一层套一层。
XHTML网页必须有DTD文档类型定义代码。

DTD文档类型定义

DTD文档类型定义的目的：是一种验证机制，也就是说检验一下你写的XHTML标记语法是否合法。

DTD三种类型：

严格型的DTD（strict）：使用CSS代替各种表现标记，如：<font>、<b>
过渡型的DTD（transitional）：可继续使用表现标记
框架的DTD（frameset）

表格标签

1、表格的结构：块元素，如：1行2列

<table>

<tr>

</tr>

</table>

2、table的属性：

width：表格的宽度，单位可以是百分比，也可以是固定值
height：表格高度
align：表格水平对齐方式，取值：left、right、center
border：边框粗细
bordercolor：边框颜色
bgColor：表格背景色
background：背景图片URL
cellpadding：单元格边线到内容间距离（填充距离）
cellspacing：单元格与单元格之间的距离（间距）
rules：合并单元格边框线，取值：all。rules兼容性不好，请使用CSS来取代它。

3、<tr>属性--->行标记

bgcolor：行的背景色
height：行的高度，没有宽度
align：行中的文本水平格式
valign：垂直居中，取值：top、middle、bottom

4、<td>或<th>属性

<td>是普通单元格，<th>是标题单元格（默认自动加粗居中，一般为表格第一行）

width：单元格宽度，就是列宽
height：单元格高度，就是行高
bgcolor：单元格背景色
backgroud：单元格背景图片
align：水平对齐
valign：垂直对齐
rowspan：上下单元格合并。合并属性必须放在第一个单元格中
colspan：左右单元格合并。<td colspan=“2”>，合并一个必须删除一个，有增就有减，保证每一行单元格个数不变

5、表格标题

语法格式：<caption></caption>
提示：<caption>标记是<table>的子标记。

表单

1、表单的概念

表单主要用来获取客户端用户的数据（信息）。如：注册表单、查询表单、登陆表单等

2、表单的工作原理

浏览有表单的网页，填写一些必要的信息，然后点击某个按钮进行提交
这些表单数据，通过互联网，传递到服务器上
服务器上有专门的程序，对表单数据进行验证。如果验证成功，则返回一个验证成功的信息；验证失败，将返回一个错误信息。

从工作原理来看，表单的制作分为两个部分：一是前台页面的制作，二是后台对表单数据的处理

3、表单的结构<form></form>

简单登陆：

用户名：<input type=“text” name=”username” />

密码：<input type=“password” name=“userpwd” />

</form>

4、form标记的属性——>块元素

name：表单名字。主要给JavaScript来用，进行客户端表单验证。
method：表单的提交方式，取值：get或post
action：指定表单的处理程序，一般是PHP、ASP、Java文件
- 如果action为空，提交到当前文件，自己来处理
enctype：指定表单数据的编码方式（加密方式），这个属性只能用在method=“post”情况下，取值：
- application/x-www-form-urldecoded：默认的传值方式
- multipart/form-data：如果上传文件，使用该值

GET方法和POST 方法

1、get方式（默认方式）：

是将表单数据追加到action指定的处理程序的后面，通过地址栏传值（？：后跟参数，也称“查询字符串” ； &：多个参数的分隔符）的方式，向服务器发送数据
如果某个表单元素，不想往服务器传递数据，那么可以不给它加name属性。传递到服务器的数据，如果没有name，就无法获取它的值。（submit。。。）
get方式的特点
- get方式提交的数据不安全，不能提交敏感的数据
- get方式只能提交少量数据。因为地址栏的长度有限制，大约100多字符
- get方式下不能上传附件

2、POST方法：

post提交方式，它不将表单数据追加到地址上，而是直接传给表单处理程序
post方式的特点
- post提交数据相对安全
- post可以提交海量数据
- post可以上传附件

表单元素

表格和表单的嵌套顺序：form嵌套table，table放内容

1、单行文本域

语法格式：<input type=“text” 属性=“值” />
常用属性：
- name：文本框的名字。命名规则是：可以包含字母、数字、下划线，只能以字母开头
- type：表单元素的类型，text
- value：文本框的值（一般自己输入）
- size：文本框的长度，以“字符”为单位
- maxLength：最多可以输入多少个字符，超出的就输不进去了
- readonly：只读属性。可以选中，但不能修改。如：readonly=“readonly”
- disabled：禁用属性。不能选中，不能修改。如：disabled=“disabled”