标签作用（三）
20181116
一、<a>标签
在网页制作的过程中，使用<a>标签实现超链接。只要为文本加入<a>标签，文字的颜色会自动变为蓝色，被点击过的变为紫色。语法为：
<a href=”目标网址” title=”鼠标滑过显示的文本”>链接显示的文本</a>
<a href="http://www.imooc.com" title="点击进入慕课网">click here!</a>
上面的例子作用是单击click here!文字，网页自动链接到http://www.imooc.com。
title属性的作用，鼠标滑过链接文字时会显示这个属性的文本内容。这个属性在实际网页开发中作用很大，主要方便搜索引擎了解链接地址的内容（语义化更友好）。但是title不是必须的。
<a>标签在默认情况下，链接的网页是在当前浏览器窗口中打开，有时需要在新的浏览器窗口中打开。方法如下：
<a href="目标网址" target="_blank">click here!</a>
二、mailto
<a>标签还有一个作用是可以链接Email地址，使用mailto能让访问者便捷向网站管理者发送电子邮件。注意：如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。
三、<img>标签
在网页的制作中为使网页炫丽美观，肯定是缺少不了图片，可以使用<img>标签来插入图片，语法：
<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">
<img src = "myimage.gif" alt = "My Image" title = "My Image" />
注意：
1、src：标识图像的位置；
2、alt：指定图像的描述性文本，当图像不可见时（下载不成功时），可看到该属性指定的文本；
3、title：提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本)；
4、图像可以是GIF，PNG，JPEG格式的图像文件。
四、表单标签
使用HTML表单（form）可以使网站和用户进行交互。通过表单把浏览者输入的数据传送到服务器端就可以进行处理。语法：
<form method="传送方式" action="服务器文件">
1.<form> ：<form>标签是成对出现的，以<form>开始，以</form>结束。
2.action ：浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。
3.method ： 数据传送的方式（get/post）。
4.所有的表单控件（文本框，文本域，按钮等）都必须放在<form></form>之间。
五、文本输入框、密码输入框
当用户要在表单中键入字母、数字等内容时，就会用到文本输入框。文本框也可以转化为密码输入框。语法为：
<form>
<input type=”text/password” name=”名称” value=”文本” />
</form>
1、type：
当type="text"时，输入框为文本输入框;
当type="password"时, 输入框为密码输入框。
2、name：为文本框命名，以备后台程序ASP 、PHP使用。
3、value：为文本输入框设置默认值。(一般起到提示作用)
<form>
姓名：
<input type="text" name="myName">
<br/>
密码：
<input type="password" name="pass">
</form>
六、文本域与多文本输入
当用户需要在表单中输入大量的文本时，需要用到文本输入域。语法规则为：
<textarea rows=”行数” cols=”列数”>文本</textarea>
1、<textarea>标签是成对存在的；
2、cols：列数；可以用CSS中的width代替
3、rows：行数；可以用CSS中的height来代替
4、在<textarea></textarea>标签之间可以输入默认值
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>文本域</title>
</head>
<body>
<form action="save.php" method="post" >
<label>个人简介：</label>
<textarea cols="50" rows="10">在这里输入内容...</textarea>
<input type="submit" value="确定" name="submit" />
<input type="reset" value="重置" name="reset" />
</form>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
