stylus设置兄弟元素样式：
鼠标浮动在 .video-li 元素上时，.video-li 兄弟中 .video-info 下的 .word 显示。

 .video-li

            &:hover

                ~ .video-info

                    .word

                        visibility visible

设置 h1 兄弟元素中，class 为 p1 的元素样式：

<!DOCTYPE HTML>

<html>

<head>

<style type="text/css">

h1 ~ .p1 {margin-top:50px;}

</style>

</head>

<body>

<h1>This is a heading.</h1>

<p>This is paragraph.</p>

<p>This is paragraph.</p>

<p>This is paragraph.</p>

<p>This is paragraph.</p>

<p class="p1">This is paragraph.</p>

</body>

</html>

stylus选中hover元素的兄弟元素下的子元素的更多相关文章

  1. jquery层级原则器（匹配父元素下的子元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. Flex 4 不同主题下容器子元素的管理方法

    Flex 下,容器主要分两类:Spark容器, Halo容器. Spark容器 Halo容器 说明 numElements numChildern 容器的子元素数量. addElement( ) ad ...

  3. display:flex;下的子元素width无效问题

    因为flex属性默认值为flex:0 1 auto;其中 1 为 flex中的 flex-shrink 属性. 该属性介绍: 一个数字,规定项目将相对于其他灵活的项目进行收缩的量. 根据上述介绍可以理 ...

  4. 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后，子元素不随着滚动条滚动的问题

    解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题   在IE6,IE7下,子元素使用position:relati ...

  5. 父元素高度设置为min-height，子元素高度设置为100%，但实际上子元素高度你知道是多少吗？

    前言 给父元素一个min-height,子元素设置height:100%. 代码 <!DOCTYPE html> <html> <head> <title&g ...

  6. 关于在transform下的子元素设置fixed无效的困惑

    最近的项目是要实现一个点击显示隐藏边栏的效果,而且需要边栏随着滚动而滚动. 思路简单,不就一个css的动画和一个position为fixed,搞定!但不想,设为fixed的子元素竟然无法fixed,这 ...

  7. js 下获取子元素的方法

    笔记核心: firstElementChild只会获取元素节点对象,从名称就可以看出来,firstChild则可以获取文本节点对象(当然也可以获取元素节点对象),比如空格和换行都被当做文本节点. js ...

  8. CSS子元素居中(父元素宽高已知，子元素未知)

    <style> .container{width:400px; height:400px; position:relative;} .center{position:absolute; l ...

  9. 解决 border-radius 元素在应用了 transform 的子元素 时overflow:hidden 失效的问题

    受大家启迪,于是最近深入研究了一下Css3中的一些属性.之中也是碰到了个不为我知的问题,在这里特此总结并与大家分享. 问题重现:在父元素上应用了 border-radius 的圆角属性.加上  ove ...

随机推荐

  1. Spring事务管理的另一种方式--TransactionTemplate编程式事务管理简单入门

    1, 一直以来, 在用Spring进行事物管理时, 只知道用声明式的策略, 即根据不同的数据源, 配置一个事物管理器(TransactionManager), 通过配置切面(PointCut)应用到相 ...

  2. Codeforces Round #427 (Div. 2)

    B. The number on the board 题意: 有一个数字,它的每个数位上的数字的和不小于等于k.现在他改变了若干位,变成了一个新的数n,问现在的数和原来的数最多有多少位不同. 思路: ...

  3. iOS与web交互的那些事

    一转眼又是大半年过去了,除了上架了一款新应用外,也没什么进步.所以最近琢磨着搞点事情,不然我那本Java教程都快看完了. 做为一名iOS高(la)阶(ji)法师,几乎所有的任务里,都会出现web这个从 ...

  4. sort排序错乱问题

    对于sort排序  之前就遇到过这种问题  不过没有在意 今天遇到 就找了一下原理 在这种sort排序中可以看到排序几乎没有什么问题 就是5比较特殊 会在20是的后面 ~ sort()方法开始的时候会 ...

  5. 算法竞赛入门经典 习题2-10 排列(permutation)

    习题2-10 排列(permutation) 用1,2,3,-,9组成3个三位数 abc, def, 和ghi,每个数字恰好使用一次,要求 abc:def:ghi = 1:2:3.输出所有解.提示:不 ...

  6. java类的继承，多态，抽象类与接口

    知识点梳理:     1,怎样定义自己的类. MyStarFrame,MyStarPanel 类中定义: (1)属性(数据),变量. (2)方法(函数),行为. (3)构造方法(特征,作用,何时被调用 ...

  7. OS作业模拟SJF和FCFS

    一个OS的作业, 用于模拟短作业优先 和 先来先服务两种作业调度方式. #!/usr/bin/python3.5 ## Modify the SJF and FCFS algorithm in the ...

  8. c# 数组简述

    数组的声明与赋值:int[] a=new int[6]; 数组初始化器:int[] a=new int[2]{1,3}; 数组初始化器简化版:int[] a={1,3}; 数组初始值: 数字类型: 0 ...

  9. 安卓开发中SQLite的使用（附实例）

    在Android平台上系统内置了丰富的API来供开发人员操作SQLite,我们可以轻松的完成对数据的存取.下面以我自己创建的收入信息表(InAccount)为例,来学习SQLite的使用. 主要是四个 ...

  10. 关于HttpSession

    HttpSession  使用Cookie有一个非常大的局限,就是如果Cookie很多,则无形的增加了客户端与服务端的数据传输量.而且由于浏览器对Cookie数量的限制,注定我们不能再Cookie中保 ...