导航:首页 > 万维百科 > 网页设计鼠标经过字变色

网页设计鼠标经过字变色

发布时间:2020-09-11 13:27:01

1、网页设计中,当鼠标移过字体颜色会发生变化的效果怎么做啊

直接在CSS文件中添加一个定义链接就是了,在需要的地方调用,比如:

/*网站链接总的CSS定义:可定义内容为链接字体颜色、样式等*/

a{text-decoration: underline;} /*链接无下划线none,有为underline*/
a:link {color: #00007f;} /*未访问的链接 */
a:visited {color: #65038e;} /*已访问的链接*/
a:hover{color: #ff0000;} /*鼠标在链接上 */
a:active {color: #ff0000;} /*点击激活链接*/

2、html鼠标滑过 文字变色 求最简单的方法!!

实现鼠标经过背景变色的方法有很多,
方法一:直接写在HTML代码中。
<div onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">
html鼠标滑过 文字变色
</div>

方法二:先设置固定的样式,然后调用。

<style>
.d_over{background-color:#307172;}
.d_out{background-color:#EFEFEF;}
</style>

<div class="d_out" onmouseover="this.className='d_over'"
onmouseout="this.className='d_out'">哈哈哈哈哈</div>
方法三、使用<a>标签。这也是常用的方式

一般<a>是用来定义链接的样式的,并不是定义某个区域的。现在常用的div+css的网页用,div就是表示区域的意思,还是喜欢用这种,当然用table的话,会有更简单的方法。

其实现在用的较多的是用<a>标签实现的。

<style>
a {color:red;
width:100px; height:22px; line-height:22px;}
a:hover {background:#f4f4f4;
color:#000;}
</style>

这样只要是代连接的都会变哦,你可以在某区域用,则某区域里面的所有来连接的都会鼠标经过变色。
也可以直接对一个区域的a标签写独立的样式。
例如:
<div class="bs">
<a>鼠标划过变由红变黑</a></div>
css中 设置:
.bs a {color:red; width:100px; height:22px; line-height:22px;}
.bs a:hover {background:#f4f4f4; color:#000;}
这样,就不影响其他的a标签。

3、网页制作javascript鼠标经过文字变色问题

<style type="text/css">
body,td,th {
font-size: 18px;
color: #999;
font-weight: bold;
}

上面已经设置了td,th文字颜色属性,

<td width="62"><div align="center"><a href=page1.html style="color='#999';cursor:hand" onmouseover="javascript:this.style.color='red'" 
onmouseout="javascript:this.style.color='#999'">游戏介绍</a></div></td>

这里又设置了颜色属性,不过行内样式优先,可以改成style="color=blue;............",这时即:

<style type="text/css">
body,td,th {
font-size: 18px;
color: #999;
font-weight: bold;
}<td width="62"><div align="center"><a href=page1.html style="color='blue';cursor:hand" onmouseover="javascript:this.style.color='red'" 
onmouseout="javascript:this.style.color='#999'">游戏介绍</a></div></td>

这时颜色body,td,thcolor属性已经不起作用了也可以下面这样,去掉行内style="color:#999",行内的color属性去掉 前边color设置成你要的其实颜色。

<style type="text/css">
body,td,th {
font-size: 18px;
color: blue;
font-weight: bold;
}
<td width="62"><div align="center"><a href=page1.html style="cursor:hand" onmouseover="javascript:this.style.color='red'" 
onmouseout="javascript:this.style.color='#999'">游戏介绍</a></div></td>

有点乱,希望有帮助!

4、如何在网页实现鼠标经过文字后更改颜色?

一般我做的鼠标经过文字后改变颜色的都是这段文字是一个链接 文字是链接的话就可以在页面属性里改一下 链接(css)这一栏 把那四个什么什么链接都改一下不一样的颜色就可以了 楼主可以试试 要是这文字不是链接的话就做成图片吧 两张不一样颜色文字的图片 插入鼠标经过图像就可以了 其他的我就不会啦 哈哈 这个本人接触的也少

5、如何在网页中做鼠标经过不同文字变不同颜色色效果

<html>
<head>
<style>
a.ji{color: blue; }
a.jl:hover{color: red}

a.un{text-decoration : none }
a.un:hover{text-decoration: underline;}

a.com{color="white"}
a.com:hover{color:black;}

</style>
</head>
<body>
<a href="" class="jl">个人简历</a><br><br><br><br>
<a href="" class="com">公司简介</a><br><br><br><br>
<a href="" class="un">我有下划线哦</a><br>
</body>
</html>

6、网页设计中如何让字体的颜色随着鼠标的移动或者鼠标经过字体时而改变?

样式表的运用

中添加代码
a:link
{
//鼠标未经过时也就是网页显示的颜色
color:darkgreen;
text-decoration:none;//不显示下划线
}
a:hover
{
//鼠标经过时也就是点击时颜色
color:red;
position:relative;
top:1px;
//鼠标经过时让链接的文字上移一像素(动态效果就在这)
text-decoration:none;
}
a:visited
{
//鼠标经过后也就是点击链接后的颜色
color:blue;
position:relative;
top:1px;
text-decoration:none;
}

7、Dreamweaver中如何制作鼠标经过导航栏文字变色

在你的网页的head标签里加入这段代码
<style type="text/css">
<!--
body{font-size: 12px;}
a{color: #0F0; text-decoration: none; }
a:hover {color: #F00; text-decoration: none; }
-->
</style>
a是指<a></a>这段标签
:hover是鼠标经过时的状态
这是css,如果还有问题可以直接问我

8、网页中当鼠标经过时,字体变色的代码?

onMouseOver=this.style.backgroundColor='#DCECF4'; onMouseOut=this.style.backgroundColor=''
随便套用:
<tr onMouseOver=this.style.backgroundColor='#DCECF4'; onMouseOut=this.style.backgroundColor=''>

<td onMouseOver=this.style.backgroundColor='#DCECF4'; onMouseOut=this.style.backgroundColor=''>

<a onMouseOver=this.style.backgroundColor='#DCECF4'; onMouseOut=this.style.backgroundColor=''>xxxxxxx</a>

9、网页中,当鼠标经过时,链接的文字变色是怎么实现的?

a:hover
{color:#f00;}我这里写了个红色的值;
你可以改动,你的a
是白色,
滑过也是白色,
你给你的
a:hover
改变个颜色值
就可以看到了

10、用HTML怎么设置:当鼠标放在字上面的时候,字体就变色

可以将所要变色的文字放进一个标签里,比如<p>标签,让后对这个标签添加一个hover属性,即当鼠标停留在这个标签上时会触发设定好的效果。以下演示具体步骤。

1、打开一个HTML文件,添加好基本标签并在body标签里添加p标签,并在p标签里添加所要变色的文字。

2、接下来对p标签添加css样式,并添加hover属性。当鼠标悬停在p标签上时间文字变为红色,大小变为60px。

3、编辑好后保存在浏览器中执行该HTML文件,鼠标悬停在文字上即可看到效果了。

与网页设计鼠标经过字变色相关的知识