首页 新闻 会员 周边 捐助

请问这种CSS写法怎么没效果呢?

0
悬赏园豆:5 [已解决问题] 解决于 2015-04-24 17:27

最近在看bootstrap的代码时,发现有种CSS是这样写的。。

parent{...}

parent>sub{...}

 

在HTML中直接class="sub",这样sub的样式就自动继承parent的了,

而不用写成class="parent sub",

也不用在sub这层HTML外套一个HTML标签来设置成parent...

 

可是我自己这样写没有效果,以前也没有看到css中用>表示继承

请问他们是怎么做到的呢?

hexllo的主页 hexllo | 菜鸟二级 | 园豆:318
提问于:2015-03-30 10:30
< >
分享
最佳答案
0

你写错了css选择器,建议多看看教程,如http://www.w3school.com.cn/css/css_selector_type.asp。

你上面的选择器应该这样写

<style>
.par>.sub {
   font-size: 18px;/*自己的样式*/
}
</style>

有一定基础再看bootstrap的源码吧

收获园豆:5
进击的小矮人 | 菜鸟二级 |园豆:316 | 2015-03-30 10:36

感谢你的回答,可是我写成这样也不行。。

是哪错了?

hexllo | 园豆:318 (菜鸟二级) | 2015-03-30 14:43

@hexllo: 我仔细看了一下你的样式。首先,'>'这个css选择器你用错了,这个是子孩子选择器。

<html class="par0">
<body>
<style>
.par{
  font-weight: bolder;
}
.par>.sub {
  font-size: 20px; /*你上面的属性值不是有效值*/
}
</style>
<div class="par">
    <div class="sub">
    </div>
</div>
</body>
</html>

这样的话,元素par的子孩子中才有sub元素,".par>sub"这个css规则才起作用。

而<html class="par0">不是sub的直接父元素,所以".par0>.sub"是不起作用的,但是".par0 .sub"规则是有效的,它表示选择.par0元素下所有类名含有sub的元素。

css选择器博大精深,慢慢来理解,先用最简的id选择器和类选择器,而且也是最高效的选择器了。之后在慢慢接触其他选择器,然后再了解css3新增的选择器。

我是学渣,但希望共同学习,希望我的回答能帮到你。

进击的小矮人 | 园豆:316 (菜鸟二级) | 2015-03-31 15:58

@进击的小矮人: 非常感谢,我发现那个>不写也是一样的,还是要用

<div class="parent">

  <div class="sub"></div>

</div>

这种方式来嵌套.

hexllo | 园豆:318 (菜鸟二级) | 2015-04-24 17:27
其他回答(4)
0

sub是什么元素?.sub吧?

利维坦 | 园豆:204 (菜鸟二级) | 2015-03-30 10:47
0

很明显,楼上有答案了。>我很少用,我习惯于用 嵌套继承 。

angelshelter | 园豆:9914 (大侠五级) | 2015-03-30 10:59
0

类还没有搞清楚,建议先看一下css基础。

Albert Fei | 园豆:2102 (老鸟四级) | 2015-03-30 11:54
0

1、要学习>的真正用法。

 

2、你的代码两个错误,第一个一楼说明了,第二个呢,那是说class为par的对象下的第一个(忘记>是否第一个的意思了,嘿嘿,我也要去学习下>的真正用法了)sub,而你的代码却没有par类的应用。

519740105 | 园豆:5810 (大侠五级) | 2015-03-30 16:50
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册