html鼠标经过自动展开和点击展开代码。

html-css012

html鼠标经过自动展开和点击展开代码。,第1张

1.创建一个新的HTML文件百,该文件被称为测试。标题是“CSS实现的鼠标在导航栏上显示的超链接的下划线效果”。

2.在页面上写nav标签,放入三个超链接(首页,第一栏,第二栏),代码如下。

3.运行代码,效果如下。

4.使用backCSS来美化字体大小、颜色和导航字体的排列。守则如下。

5.运行代码,效果如下:可见,经过CSS样式美化,当鼠标经过时,显示蓝色。

6.使用CSS代码,实现鼠标在上面显示下划线效果,代码如下。

7.在浏览器中运行代码以达到预期的效果。

给按钮上绑定一个onclick事件,同时置一个状态值,状态值为true时显示按钮。

具体代码如下:

<html>

<head>

<script type="text/javascript" src="https://ss1.bdstatic.com/5eN1bjq8AAUYm2zgoY3K/r/www/cache/static/protocol/https/jquery/jquery-1.10.2.min_f2fb5194.js"></script>

</head>

<body>

<button id="a">btn1</button>

<button id="b">btn2</button>

<script>

$(document).ready(function()

{

$("#a").click(function()

{

$("#a").hide()

})

$("#b").click(function()

{

$("#a").show()

}

)

})

</script>

</body>

</html>

1、方法一,利用html特性,每个标签都有一个title属性。当鼠标hover在该标签内容上时,浏览器展示出该标签的title内容,让鼠标移走,内容消失,如下:

div{

height:100px

width:100px

background-color: aqua

}

<div title="我是鼠标悬停展示的内容">文字内容文字内容</div>

.on a{color:#8B8B8Bbackground:#EFEFEF url(phone.png) no-repeat 10px -30px}加个这个就好了,因为你写了鼠标经过的时候添加了个当前样式,给当前样式下的a添加颜色。。

A标签的属性:

1、href :链接到的目标网址

2、color:超链接颜色

3、target:点击超链接后行为怎样发生

4、title:把鼠标放在超链接上,会显示title里的内容

4、font-size:超链接字体大小