鼠标经过效果 - - ITeye博客

`

kuchaguangjie

浏览: 442733 次
性别:
来自: 深圳

最近访客更多访客>>

haeng

freecutelei

xuhuanfeng

超神不坑

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

yiguxianyun： ...
css li 不换行
stdayong： ...
netbeans 中使用 maven
程序猿_星：为啥会中文乱码啊
servlet 以 gzip 格式返回数据
huanhuan519：感谢分享~
gdb 调试工具
heyl1234：写过些js，对css还不熟。谢谢~
css li 不换行

鼠标经过效果

博客分类：

css

浏览器 XHTML HTML

阅读更多

鼠标经过效果

------
效果概述：

鼠标经过，显示不同的背景的效果，

------
实现：

可以通过 <a> 的 :hover 实现，因为 :hover 被所有主流浏览器支持，因此有较好的兼容性，

------
例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
/* 鼠标经过效果，用 a 标签实现 */
.link_one,.link_one:link,.link_one:visited {width: 60px;height: 40px;color:#FFF;background-color: #0F0;text-decoration: none;}
.link_one:hover {background-color: #FF0;color:#F00;}
</style>
</head>
<body>
	<a href="#" class="link_one" onclick="alert(1);">link</a>
</body>
</html>

------

分享到：

ps 切图 | udp 简单使用

2010-10-17 16:47
浏览 1314
评论(0)
分类:Web前端
查看更多

评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

117个css3鼠标经过效果.zip: 在前端开发领域，CSS3（层叠样式表第三版）为网页设计带来了许多创新和增强的功能，其中之一就是鼠标经过效果。这些效果使得用户与网页的交互变得更加生动和有趣。"117个css3鼠标经过效果.zip"这个压缩包文件包含了...

117个图片css3鼠标经过效果: 在本主题“117个图片css3鼠标经过效果”中，我们将探讨CSS3如何实现图片在鼠标悬停时的动态变换，以及这些效果可能带来的用户体验提升。 1. 鼠标悬停伪类选择器：`:hover` CSS3中的`:hover`伪类选择器允许我们在...

css3动画制作5种鼠标经过效果: 其中，鼠标经过效果（Hover Effects）是常见的交互设计之一，它可以提升用户体验，引导用户的注意力。下面，我们将深入探讨如何利用CSS3创建五种不同的鼠标经过效果。一、颜色变换效果一种常见的鼠标经过效果是...

117个css3鼠标经过效果: 在这个压缩包中，Bootstrap可能被用来快速构建响应式布局，使得这些鼠标效果在不同设备上都能良好展示。 4. **img**：这个文件夹可能包含了用于演示效果的图像资源，如图标、背景图片等，它们与CSS3的鼠标经过效果...

仿新浪左侧鼠标经过效果: "仿新浪左侧鼠标经过效果"是一个常见的网页设计技巧，它主要用于增强用户在浏览网站时的互动感。这个效果主要体现在当用户将鼠标指针悬停在页面左侧某个元素上时，会触发一个控制层的显示，通常用来展示更多的相关...

CSS3鼠标经过导航菜单动画效果代码: 本示例中，我们将深入探讨如何使用CSS3实现鼠标经过导航菜单时的动画效果。首先，`index.html`文件是网页的主体结构，它包含了HTML元素，如`<nav>`用于创建导航菜单，`<ul>`和`<li>`用于构建菜单项。CSS3的鼠标...

CSS 鼠标经过图片效果合集: "CSS 鼠标经过图片效果合集"是一个集合，展示了如何利用CSS来实现当鼠标指针悬停在图片上时，产生各种不同的视觉效果。这些效果可以是简单的变换，如颜色变化或大小调整，也可以是复杂的动画效果，如淡入淡出、旋转...

JQuery鼠标经过延迟处理: 以下是一个基本的jQuery实现延迟鼠标经过效果的例子： ```javascript $(document).ready(function() { var hoverTimeout; // 鼠标进入元素 $('.yourElement').mouseover(function() { clearTimeout...

很酷的六种CSS 鼠标经过图片效果（含HTML文件）: 本文将深入探讨“很酷的六种CSS鼠标经过图片效果”，这些效果能够为网站增添动态魅力，提升用户的浏览体验。以下是对每种效果的详细描述，以及如何在HTML文件中实现它们。 1. **渐变过渡**：当鼠标悬停在图片上时...

117个纯css3鼠标经过动画效果.rar: 【标题】"117个纯css3鼠标经过动画效果.rar"所涵盖的知识点主要集中在CSS3的新特性上，特别是与交互式用户体验相关的动画设计。CSS3（Cascading Style Sheets Level 3）是CSS规范的最新版本，它引入了许多增强网页...

鼠标经过样式js实现: 在网页设计中，鼠标经过样式（Hover Effect）是一种常见的交互设计元素，用于增强用户体验，当用户将鼠标指针悬停在某个元素上时，该元素会呈现不同的视觉效果。JavaScript（JS）作为客户端脚本语言，可以灵活地实现...

jQuery鼠标经过变化过渡效果.zip: 在本文中，我们将深入探讨如何使用jQuery和CSS3来创建一个动态的鼠标经过效果，特别是在文字翻转背景色的变化过渡特效。这个效果可以为网站增添交互性和视觉吸引力，提升用户体验。首先，`jQuery`是一个轻量级的...

各种鼠标经过图片的特效.rar: 总结来说，"各种鼠标经过图片的特效.rar"这个资源包是一个优秀的CSS3学习和实践素材，对于想要提升网页动态效果的前端开发者来说，是一份不可多得的参考资料。通过深入理解和实践这些特效，不仅可以提高前端开发技能...

CSS3圆形图片鼠标经过旋转效果，图片上有简短标题和说明，兼容主流浏览器: 本教程将详细讲解如何利用CSS3实现一个圆形图片的鼠标悬停旋转效果，并在图片上展示简短标题和说明，同时确保这个效果在主流浏览器中具有良好的兼容性。首先，我们需要创建HTML结构，它通常包含一个`<div>`作为...

鼠标经过css3动画网页特效: 在本主题中，我们关注的是CSS3的一个重要应用领域——动画效果，特别是当鼠标经过元素时触发的动画。在传统的CSS2中，虽然可以实现一些简单的动态效果，如过渡（transition）和旋转（rotation），但CSS3的动画功能...

漂亮鼠标经过渐变效果: 在网页设计中，"漂亮鼠标经过渐变效果"是一种增强用户体验和交互性的视觉技术。这种效果通常用于按钮、链接或图标的悬停状态，当用户将鼠标指针悬停在这些元素上时，它们会发生颜色或透明度的平滑过渡，增加动态感，...

HTML+CSS 实现了一个超好看的新拟态鼠标经过的效果.zip: 使用HTML+CSS 完成了一个超好看的新拟态鼠标经过的效果。使用HTML+CSS 完成了一个超好看的新拟态鼠标经过的效果。使用HTML+CSS 完成了一个超好看的新拟态鼠标经过的效果。使用HTML+CSS 完成了一个超好看的...

Global site tag (gtag.js) - Google Analytics