关于css选择器的一个小小的问题

前言

昨天在写一个页面的时候，写到css样式的时候，出现了一个问题,让我有一开始有点想不明白，后面明白了，记录一下。

问题情况：

• 这是html代码

  <div class="father">
      <ul>
          <li class="son"></li>
      </ul>
  </div>

• 这是css代码

  .father ul li{
      display:none; 
      /* 此时这个div块中的所有内容都将不显示 */
  }
  .son{
      display:block;
      /* 起初我认为此时这个li中放的所有内容都应该显示，但是我在li中放的图片并没有显示，我就去查看控制台的样式，发现在这个li中的样式是有block这个属性但是并没有生效。 */
  }
  .father ul .son{
      display:block;
      /* 后面我尝试着这样写，却发现这下图片就显示出来了 ，随后并猜测是选择器优先级的问题，随即查阅资料，发现组合选择器的优先级为成员选择器的权重相加，只写一个类选择器干不过上面的多个选择器权重相加，所以多组合一些就好了，或者用!important 来拉满。*/
  }

总结

选择器的权重问题。
虽然以前看到过选择器优先级相关的知识，但是还没有接触过很多这种情况，以后要注意！