样式书写顺序问题

如果这样子

.codrops a:hover { code }
.codrops a.current-deomo { code..}

hover定义在当前a.current-demo前的话，就不需要写分隔了

.codrops-demos a.current-demo,

.codrops-demos a.current-demo:hover { code.}

就是不知道这样写好不好

最外的红 2017-03-23

源自：CSS3图片切换特效 1-4 页面导航

收起

2回答

提问者最外的红 2017-03-23 14:31:24

 .codrops-demos a.current-demo,
 .codrops-demos a.current-demo:hover { 
     code..
  } 
  .codrops-demos a.current-demo:hover ｛ 
      code..
   ｝  /* 老师的写法 */
   
 .codrops-demos a.current-demo:hover ｛ 
     code..
 ｝
 .codrops-demos a.current-demo { 
     code..
} /* 我的写法 */

其结果都是当鼠标移到当前项的时候，当前项的样式不发生改变。我的写法，省下了一个选择器，现在测试是能用，就是不知道如果代码多起来的时候，选择器优先级上会不会出现问题。

收起回答

风硕依源 2017-03-23 13:01:10

不是很明白你的意思

你是不是在说，a和a:hover的样式是一样的？如果是这样的话，可以不写

收起回答

提问者最外的红 #1

是我描述得有点不清楚，老师的写法是 .codrops-demos a.current-demo, .codrops-demos a.current-demo:hover { code.. } .codrops-demos a.current-demo:hover ｛ code.. ｝实现当前项hover 时候样式不发生改变我的想法是， .codrops-demos a.current-demo:hover ｛ code.. ｝ .codrops-demos a.current-demo { code.. } hover 的样式定义在当前项 .current-demo 之前，就不需要在当前项那里，再增加一个.codrops-demos a.current-demo:hover 的选择器。

2017-03-23 14:27:41