[ css ] 随心所欲的选择器

[ouuz]

第 4 天 这天小张同学又开始想整这些花里胡哨的东西，但她有点懒，请你帮帮她熟练运用css选择器实现如下效果（给出html代码，注意html部分代码不可改动）

  <div id="redBox">给我加上红色背景</div>

  <div class="greenBox">给我加上绿色背景</div>

  <div class="fontBox">
    <p>把我们的字体都变成25px</p>
    <p>把我们的字体都变成25px</p>
    <p>把我们的字体都变成25px</p>
  </div>

  <h1>把我的颜色变成红色</h1>

  <div class="sonBox">
    <p>把我颜色变成红色</p>
    <div>
      <p>我的颜色不能变</p>
    </div>
  </div>

  <div>
    <p>我不是绿色的</p>
    <div>弟弟弟弟</div>
    <p>我是绿色的</p>
  </div>

[deximy]

        <style>
            #redBox
            {
                background-color: #ff0000;
            }
            .greenBox
            {
                background-color: green;
            }
            .fontBox
            {
                font-size: 25px;
            }
            h1
            {
                color: #ff0000;
            }
            .sonBox>p
            {
                color: #ff0000;
            }
            div div+p
            {
                color: green;
            }
        </style>

[ouuz]

        <style>
            #redBox
            {
                background-color: #ff0000;
            }
            .greenBox
            {
                background-color: green;
            }
            .fontBox
            {
                font-size: 25px;
            }
            h1
            {
                color: #ff0000;
            }
            .sonBox>p
            {
                color: #ff0000;
            }
            div div+p
            {
                color: green;
            }
        </style>

不愧是您！很不错嗷！但是那个 fontBox本意是想让练习 .fontBox p后代 选择器的QAQ 有点小失误，且最后一个兄弟选择器可以直接写成 div+p 前一个div不用写嗷！很棒啦！

[deximy]

        <style>
            #redBox
            {
                background-color: #ff0000;
            }
            .greenBox
            {
                background-color: green;
            }
            .fontBox
            {
                font-size: 25px;
            }
            h1
            {
                color: #ff0000;
            }
            .sonBox>p
            {
                color: #ff0000;
            }
            div div+p
            {
                color: green;
            }
        </style>

不愧是您！很不错嗷！但是那个 fontBox本意是想让练习 .fontBox p后代 选择器的QAQ 有点小失误，且最后一个兄弟选择器可以直接写成 div+p 前一个div不用写嗷！很棒啦！

p继承了fontBox那直接设置fontBox不是更合适嘛(
div div+p相对来讲精确度更高一点，万一前面div后面有个p那就误伤无辜了XD

[ouuz]

        <style>
            #redBox
            {
                background-color: #ff0000;
            }
            .greenBox
            {
                background-color: green;
            }
            .fontBox
            {
                font-size: 25px;
            }
            h1
            {
                color: #ff0000;
            }
            .sonBox>p
            {
                color: #ff0000;
            }
            div div+p
            {
                color: green;
            }
        </style>

不愧是您！很不错嗷！但是那个 fontBox本意是想让练习 .fontBox p后代 选择器的QAQ 有点小失误，且最后一个兄弟选择器可以直接写成 div+p 前一个div不用写嗷！很棒啦！

p继承了fontBox那直接设置fontBox不是更合适嘛(
div div+p相对来讲精确度更高一点，万一前面div后面有个p那就误伤无辜了XD

23333是的 直接让p继承fontBox 的就可以 我意思是我出题有点小失误了 QAQ 没想好这里怎么出，你写得没问题😝

[deximy]

        <style>
            #redBox
            {
                background-color: #ff0000;
            }
            .greenBox
            {
                background-color: green;
            }
            .fontBox
            {
                font-size: 25px;
            }
            h1
            {
                color: #ff0000;
            }
            .sonBox>p
            {
                color: #ff0000;
            }
            div div+p
            {
                color: green;
            }
        </style>

不愧是您！很不错嗷！但是那个 fontBox本意是想让练习 .fontBox p后代 选择器的QAQ 有点小失误，且最后一个兄弟选择器可以直接写成 div+p 前一个div不用写嗷！很棒啦！

p继承了fontBox那直接设置fontBox不是更合适嘛(
div div+p相对来讲精确度更高一点，万一前面div后面有个p那就误伤无辜了XD

23333是的 直接让p继承fontBox 的就可以 我意思是我出题有点小失误了 QAQ 没想好这里怎么出，你写得没问题😝

那再加一个30px的p标签就可以了（

[ouuz]

        <style>
            #redBox
            {
                background-color: #ff0000;
            }
            .greenBox
            {
                background-color: green;
            }
            .fontBox
            {
                font-size: 25px;
            }
            h1
            {
                color: #ff0000;
            }
            .sonBox>p
            {
                color: #ff0000;
            }
            div div+p
            {
                color: green;
            }
        </style>

不愧是您！很不错嗷！但是那个 fontBox本意是想让练习 .fontBox p后代 选择器的QAQ 有点小失误，且最后一个兄弟选择器可以直接写成 div+p 前一个div不用写嗷！很棒啦！

p继承了fontBox那直接设置fontBox不是更合适嘛(
div div+p相对来讲精确度更高一点，万一前面div后面有个p那就误伤无辜了XD

23333是的 直接让p继承fontBox 的就可以 我意思是我出题有点小失误了 QAQ 没想好这里怎么出，你写得没问题😝

那再加一个30px的p标签就可以了（

？在里面加一个30px的p标签 也不能考察到后代选择器啊2333....

[deximy]

        <style>
            #redBox
            {
                background-color: #ff0000;
            }
            .greenBox
            {
                background-color: green;
            }
            .fontBox
            {
                font-size: 25px;
            }
            h1
            {
                color: #ff0000;
            }
            .sonBox>p
            {
                color: #ff0000;
            }
            div div+p
            {
                color: green;
            }
        </style>

不愧是您！很不错嗷！但是那个 fontBox本意是想让练习 .fontBox p后代 选择器的QAQ 有点小失误，且最后一个兄弟选择器可以直接写成 div+p 前一个div不用写嗷！很棒啦！

p继承了fontBox那直接设置fontBox不是更合适嘛(
div div+p相对来讲精确度更高一点，万一前面div后面有个p那就误伤无辜了XD

23333是的 直接让p继承fontBox 的就可以 我意思是我出题有点小失误了 QAQ 没想好这里怎么出，你写得没问题😝

那再加一个30px的p标签就可以了（

？在里面加一个30px的p标签 也不能考察到后代选择器啊2333....

同时有25px和30px后代选择器还能处理嘛orz