产品需求:想在鼠标移动到“移除”的时候,“1.产品匹配测试”添加下划线和更改字体颜色

需求分析:从需求可以看出使用 :hover 就可以解决的问题,但是在实践中发现兄弟选择器(+)不好使,(+)只能是之后的,那如果想要访问当前元素(假设为a)的前一个节点(假设为b)就不能了

解决思路:对于相邻节点少的情况下可以将节点书写顺序颠倒(就是将a与b的位置换一下),然后在有排序就好啦,相关代码如下:

<style>
.history-desc{
height: 25px;
line-height: 25px;
font-size: 13px;
cursor: pointer;
text-indent: 26px;
color: #666;
}
.history-desc>div{
float: right;
}
.history-remove:hover + .history-name{
text-decoration: underline;
color: #333;
}
</style> <div class="history-desc">
<div class="history-remove">移除</div>
<div class="history-name">1.产品匹配测试</div>
</div>

css设置兄弟节点的样式(相邻的前一个节点)的更多相关文章

  1. css设置滚动条颜色与样式以及如何去掉与隐藏滚动条

    我们大家在浏览网页的时偶尔会看到很漂亮的各种颜色样式的滚动条,这就是通过css代码控制来实现的,于是本人搜集整理一番,这里和大家分享一下使用CSS设置滚动条颜色以及如何去掉滚动条的方法,需要的朋友可以 ...

  2. css设置兼容的透明样式

    css设置透明并实现兼容: <style>div{ filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; o ...

  3. CSS - 设置 select 元素的样式

    注意:option 外面有个框,这个框不同浏览器生成的还不一样,给这个框设置样式的方法也没有找到(有说法是这是浏览器创建的 shadow dom 没法设置).所以要想完全控制还是用列表进行模拟比较好. ...

  4. css设置网页文本选中样式

    网页的默认的文本选中颜色是蓝底白字(大多应该是吧),这个样子: 感觉并不是特别好看,可以通过CSS3的一个特性,一个CSS3的伪类选择器::selection来设置文本被选中时的状态,比如本博客的主题 ...

  5. html网页什么样的字体最好看,css设置各种中文字体样式代码

    css代码如下:{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,Mi ...

  6. css设置点击态样式

    .rightMenu:active { background-color: rgba(46, 103, 222, 0.13); }

  7. CSS设置input placeholder文本的样式

    placeholder是HTML5  input的新属性,英文意思是占位符,它一般表示input输入框的默认提示值. 下面是设置placeholder的文本样式的选择器的示例: /* webkit 浏 ...

  8. 详解CSS设置默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

  9. CSS 子节点继承父节点(祖先节点)的样式

    CSS 有些属性可以让子节点从父节点或祖先节点继承,文本.字体.列表属性等样式都可以被子节点继承.子节点没有自身的样式,子节点将继承父节点或祖先节点的样式. <ul class="co ...

随机推荐

  1. [经验] 使用 jQuery+JSON 实现国际化

    技术选型关键词:  [spring boot] [jQuery] [JSON] [JSP] 前言: 关于国际化, 我在一开始的时候就有一个误解, 我认为所谓国际化就是编写一段高技术含量的代码, 然后这 ...

  2. java的基本类型和对应的封装类

    封装,是java这门语言的重要核心思想之一,封装也是对面向对象这一思想很好的体现. 在很多情况下,我们需要对数据进行一些转换,如:将一字符串"123"转换成int类型的123,或者 ...

  3. Java多线程信号量同步类CountDownLatch与Semaphore

    信号量同步是指在不同线程之间,通过传递同步信号量来协调线程执行的先后次序.CountDownLatch是基于时间维度的Semaphore则是基于信号维度的. 1:基于执行时间的同步类CountDown ...

  4. MyBatis Dao层的编写

    传统的dao层编写 以前编写dao层,先新建一个包com.chy.dao,再写接口StudentDao: public interface StudentDao { public void inser ...

  5. JavaNIO第一话-Buffer

    Buffer是入门Java NIO的基础,本文希望通过一些形象的比喻来解释一下缓冲区的概念,帮助读者快速理解和记忆. 本文灵感来自于Bilibili博主v若水若水分享的尚硅谷Java视频_NIO视频教 ...

  6. 08 SSM整合案例(企业权限管理系统):07.订单操作

    04.AdminLTE的基本介绍 05.SSM整合案例的基本介绍 06.产品操作 07.订单操作 08.用户操作 09.权限控制 10.权限关联与控制 11.AOP日志 07.订单操作 SSM订单操作 ...

  7. C++字符集和词法记号以及符号常量

    C++字符集 大小写的英文字母:A~Z,a~z 数字符号:0~9 特殊字符:!#%*()等 关键字:C++预定义的单词 标识符:程序员声明的单词,它命名程序正文中的一些实体 文字:在程序中直接使用符号 ...

  8. 洛谷 P2031 脑力达人之分割字串

    题目传送门 解题思路: f[i]表示到第i位可获得的最大分割次数,对于每个f[i]都可由其符合条件的前缀转移过来,条件就是当前串除了前缀的剩余字符里有所给单词,然后一看,这不是在剩余字符里找有没有所给 ...

  9. Swift 语法糖then

    then是一个swift初始化库,只有80几行的代码库,确可以让初始化变得很优雅. 1.使用then初始化AnyObject,这里以初始化控件为例 lazy var label = UILabel() ...

  10. XV6源代码阅读-同步机制

    Exercise1 源代码阅读 锁部分:spinlock.h/spinlock.c以及相关其他文件代码 // Mutual exclusion lock. struct spinlock { uint ...