css小记:hover 鼠标滑过让该元素的子元素或者其他元素改变样式
<!DOCTYPE>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.hoverfa>a{ text-decoration:none; color:#000;}
.hoverfa:hover{ border-bottom:#6CF 1px solid; }
.hoverfa:hover a{ color:#6CF; text-decoration:none;}
.hoverfa:hover span{ color:#FFF; background:#6CF;} //该元素的子元素
.hoverfa:hover +.hoverfa1{ background:#FC6;} //其他元素
</style>
</head>
<body>
<div class="hoverfa">
<span>实时动态1</span>
<a href="#" class="admin_icon">实时动态1实时动态1实时动态1实时动态1实时动态1</a>
</div>
<div class="hoverfa1">
<span>实时动态2</span>
<a href="#" class="admin_icon">实时动态2实时动态2实时动态2实时动态2实时动态2</a>
</div>
</body>
</html>
css小记:hover 鼠标滑过让该元素的子元素或者其他元素改变样式的更多相关文章
- CSS实例:鼠标滑过超级链接文字时改变背景颜色
先讲简单的: 通过CSS可以设置超链接在不同时刻的颜色: <style> a:link {color: #FF0000} /* 未访问的链接 */ a:visited {color: #0 ...
- CSS控制当鼠标滑过时更换图片的效果
鼠标滑过时更换图片的效果有很多方法可以实现,在本文将为大家介绍喜爱如何通过css来实现.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra ...
- jQuery hover事件鼠标滑过图片半透明标题文字滑动显示隐藏
1.效果及功能说明 hover事件制作产品图片鼠标滑过图片半透明,标题文字从左到右滑动动画移动显示隐藏 2.实现原理 首先把效果都隐藏,然后定义一个伪类来触发所有的效果,接下来当触发伪类后会有一个遍历 ...
- 【javascript/css】关于鼠标事件onmousexxx和css伪类hover
在运用鼠标移入移出事件时,一般有两种做法,一种是DOM事件的"onmouseover"和"onmouseout",还有一种是css的伪类":hover ...
- CSS3鼠标滑过图标放大以及旋转
本人是HTML5-CSS3初学者,这次分享一款纯CSS3实现的图片动画,当鼠标滑过小图标时,图标会放大,同时图标会出现旋转的动画效果.我们在很多个性化个人博客中经常看到鼠标滑过人物头像后头像图片旋转就 ...
- 鼠标滑过图片变暗文字链接滑出jQuery特效
效果体验:http://hovertree.com/texiao/jquery/7.htm HTML文件代码: <!DOCTYPE html> <html xmlns="h ...
- css - a:hover变色问题
今天在帮我们学校做网站的时候,由于在css这里不是很擅长,过程中发现一个问题,a:hover的时候,字体的颜色不变.后来才发现将a和div的嵌套的问题, 我的css代码为: .left_box .lb ...
- 鼠标滑过元素,div显示,并根据scrollTop向下移动
如上图所示,通道有很多个,表格只有一个. 注意:滑过通道时鼠标如果停留在上面,那么表格才显示,鼠标滑过表格时,表格不消失 <div id="lineContent"> ...
- jQuery实现鼠标滑过图片列表加遮罩层
这个例子实现的功能是:有一列图片列表,鼠标滑过时,将有遮罩层的另一张图盖在该图片的上方,实现鼠标hover的效果. 一.HTML代码: <div class="home-content ...
随机推荐
- php框架对比
一.ThinkPHP框架 优势:简单易用(Model,Controller,View负责各自的工作),它拥有支持XML标签库技术的编译型模版引擎,支持两种模版标签, 动态编译,缓存技术.还支持自定义标 ...
- Java中final、finally、finalize
简述 final 可以用来修饰类.方法.变量,分别有不同的意义: final 修饰的 class 代表不可以继承扩展: final 的变量是不可以修改的:final 的方法也是不可以重写的(overr ...
- Linux版本内核及安装后的简单操作命令介绍
一.Linux的版本与内核 1.Linux发行版 Linux发行版= Linux内核+应用程序 Redhat,CentOS,Ubuntu,Suse,红旗,Mint,Fedora CentOS:社区版操 ...
- CoreText学习(二)之Hello world
最后更新:2017-08-10 部分内容丢失,后续补上 相关配置: Xcode 8.3.3 Swift 3.0 macOS Sierra 一.CoreText 简介 CoreText 是用于处理文字和 ...
- 【洛谷2057】 [SHOI2007]善意的投票(最小割)
传送门 洛谷 Solution 比较巧妙啊! 考虑这个只有同意和不统一两种,所以直接令\(s\)表示选,\(t\)表示不选,然后在朋友直接建双向边就好了. 代码实现 #include<bits/ ...
- 【Android】【踩坑日记】RecyclerView获取子View的正确姿势
开发过程中发现RecyclerView.getChildAt(position)为空的情况,但是明明这个position却没有越界. 解决办法:用recycler.getLayoutManager() ...
- Netfilter 之 iptable_nat
初始化 iptable_nat_table_init函数通过调用ipt_register_table完成NAT表注册和钩子函数注册的功能:该流程与iptable_filter的函数调用的函数一致,此处 ...
- Android网络编程之——文件断点下载
一:关于断点下载所涉及到的知识点 1.对SQLite的增删改查(主要用来保存当前任务的一些信息) 2.HttpURLConnection的请求配置 HttpURLConnection connecti ...
- NLP - Log-linear Models
1.The Language Modeling Problem 现在抛开我们之前讲的马尔科夫模型的假设,对于一门语言的定义,肯定不能简单依赖于每个单词的前两个单词,这是常识.比如英语中 ...
- C#Application:Exit与ExitThread 解释
Application.Exit(); 方法停止在所有线程上运行的所有消息循环,并关闭应用程序的所有窗口 Application.ExitThread 方法 退出当前线程上的消息循环,并关闭该线程上的 ...