小码哥的IT人生

HTML <input> 标签的 alt 属性 详解

HTML基础 2022-06-02 12:02:19小码哥的IT人生shichen

HTML <input> 标签的 alt 属性

实例

下面的表单拥有两个输入字段以及一个图像形式的提交按钮:

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="image" src="submit.jpg" alt="Submit" align="right" />
</form>

 

完整实例【亲自试一试】:

<html>
<body>
<form action="/demo/demo_form.php" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="image" src="/i/eg_submit.jpg" alt="Submit" align="right"/>
  <p>This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text .</p>
</form>
<p>请在这幅图像上单击,输入会发送到服务器上名为 "demo_form.php 的页面。</p>
<p class="note"><span>注释:</span>如果 type 属性设置为 image,当用户单击图像时,浏览器将以像素为单位,将鼠标相对于图像边界的偏移量发送到服务器,其中包括从图像左边界开始的水平偏移量,以及从图像上边界开始的垂直偏移量。</p>
<p>在 HTML 4.01 中,不赞成使用 input 元素的 align 属性。在 XHTML 1.0 Strict DTD 中不支持该属性。请使用 CSS 代替。</p>
</body>
</html>

可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html

定义和用法

alt 属性只能与 <input type="image"> 配合使用。它为图像输入规定替代文本。

alt 属性为用户由于某些原因无法查看图像时提供了备选的信息。

注释:即使 alt 属性不是必需的属性,但是当输入类型为 image 时,仍然应该设置该属性。如果不使用该属性,就有可能对文本浏览器或非可视的浏览器造成使用障碍。

浏览器支持

除了 Safari,所有主流的浏览器都支持 "alt" 属性。

语法

<input alt="value">

属性值

描述
value 图像 input 的替代文本。

版权所有 © 小码哥的IT人生
Copyright © phpcodeweb All Rights Reserved
ICP备案号:苏ICP备17019232号-2  

苏公网安备 32030202000762号

© 2021-2024