CSS:在div元素中设置span的样式

6mw9ycah  于 5个月前  发布在  其他
关注(0)|答案(2)|浏览(64)

我的html sode片段是

<div id="head">
   <span id="span1"> </span>
   <span id="span2"> </span>
</div>

字符集
我没有得到我的CSS工作。

#head>#span1{
  //its not working.
}


我也试

#head1:nth-child(1){
   width: 200px;
   height: 300px;
   background-color: #0000FF;
}

#head1:nth-child(2){
   width: 300px;
   height: 300px;
   background-color: #0000FF;
 }


请帮帮我。

xiozqbni

xiozqbni1#

尝试使用#head span选择所有<span>
检查这个demo

#head span{
   width: 200px;
   height: 300px;
   background-color: #0000FF;
   display:inline-block
}

个字符
尝试使用#head #spanN选择N <span>

#head #span1{
   width: 200px;
   height: 300px;
   background-color: #0000FF;
   display:inline-block
}

#head #span2{
   width: 200px;
   height: 300px;
   background-color: #FF0000;
   display:inline-block
}
<div id="head">
   <span id="span1">Lorem Ipsum</span>
   <span id="span2">Lorem Ipsum</span>
</div>

的字符串

x8goxv8g

x8goxv8g2#

<span>在一个内联元素中,所以你需要设置display:block来做适当的样式(如果你需要宽度和高度)。如果你有id,你需要在你的CSS中做的就是针对这些id。

#span1{
   width: 200px;
   height: 300px;
   background-color: yellow;
   display:block
}

#span2{
   width: 300px;
   height: 300px;
   background-color: red;
   display:block
 }

个字符

相关问题