如何html中标签上添加点击事件

如何html中标签上添加点击事件,第1张

方法一:直接在标签元素上添加

方法二:是通过js来添加

如图:

介绍:

HTML(Hyper Text Mark-up Language )即超文本标记语言,是 WWW 的描述语言,由 Tim Berners-lee提出。设计 HTML 语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起,形成有机的整体,人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上。

这样,你只要使用鼠标在某一文档中点取一个图标,Internet就会马上转到与此图标相关的内容上去,而这些信息可能存放在网络的另一台电脑中。

HTML文本是由 HTML命令组成的描述性文本,HTML 命令可以说明文字、 图形、动画、声音、表格、链接等。 HTML的结构包括头部 (Head)、主体 (Body) 两大部分。头部描述浏览器所需的信息,主体包含所要说明的具体内容。

label标签主要是方便鼠标点击使用,增强用户 *** 作体验。

1、新建html文件,在网页中设置一个性别选项,这时当用户点击性别后面的小圆点才能选择性别,由于小圆点区域比较小,想准确点击比较麻烦,所有用户体验不好:

2、为两个选项分别设置“id”属性,男性属性值为“male”,女性属性值为“female”:

3、为“男”和“女”文字都添加上“label”标签,标签属性“for”的属性值分别为“male”和“female”,这时用户点击“男”和“女”文字时也会选中对应的选项,提高了用户体验。除了单选框之外,多选框、文本框等标签也同样可以用label标签选中:

设置超链接点击过后的样式可以使用css中的visited进行设置,基本的使用方法如下:

:visited 选择器用于选取已被访问的链接,使用 :link 选择器对指向未被访问页面的链接设置样式, :hover 选择器用于设置鼠标指针浮动到链接上时的样式,:active 选择器用于设置点击链接时的样式。

工具原料:浏览器、编辑器

1、设置一个a标签的点击后的样式,点击后给标签添加黄色的背景,代码如下:

<!DOCTYPE html>

<html>

<head>

<style>

a:visited

{

background-color:yellow

}

</style>

</head>

<body>

<a href="#">test</a>

<a href="#">test2</a>

<p><b>注释:</b>:visited 选择器为已被访问的链接设置样式。</p>

</body>

</html>

2、运行代码,点击过后的超链接将会改变成css设置的样式。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7068500.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-01
下一篇 2023-04-01

发表评论

登录后才能评论

评论列表(0条)

保存