Question

我在页面布局上的嵌套div中嵌套了带有图像的div元素。我想编写CSS样式以将图像对齐到右边。我是怎么做到的：

我实际上想知道如何访问嵌套div <div id="Imagepart1" class="new1 new1-50 adjust-right">来编写CSS样式以便将图像对齐。这就是div中的div的样子：

<div id="Testcase1" class="item1 module">
   <div id="Div1" class="new-block">
       <div id="Imagepart1" class="new1 new1-50 adjust-right">
          <div class="new-gutter">
              <div>
                 <img alt src="/sitecollectioImages/MyWork/exampleimage.png">
              </div>
          </div>
       </div>
   </div>
</div>

Answer 1

一个＆＃39; id＆＃39;可以通过＆＃39;＃＆＃39;来访问符号和类可以通过点运算符访问。＆＃39;。 http://www.w3schools.com/css/css_syntax.asp

所以你实际上可以用

描述你描述的div

#Imagepart1{
  float: right
}

或访问附加到其中的一个类

.adjust-right{
  float: right
}

或明确使用所有类

.adjust-right.new.new1-50{
   float: right;
}

Answer 2

这一切都取决于应用你的风格所需的特殊性。您有几个选择：

ssh-rsa AADGD...可能就够了，这有一个 .adjust-right { float: right; }的特异性。
您还可以使用多个类来定位DIV， 0,0,1,0，具有.item1.adjust-right { float: right; }的特异性。
如果还不够，您可以加入0,0,2,0属性id，这具有#Imagepart1 { float: right; }的特异性。

此处更多关于answer。

最好通过选项1和2设置样式，并将ID保留为JS挂钩。

更新

OP询问在选择器中使用多个CSS类，以及在类之间留空间的区别是什么。

当 IS NOT CSS选择器中的CSS类之间的空格时，所有这些类必须存在于元素上以供选择器匹配。如果没有空格，则说找到类 X ，然后查看类 Y 是否出现在相同的元素上，类 X >

如果CSS选择器中的CSS类之间存在 IS 空格，那么您将定位嵌套的项目。对于您所说的每个空间（从左到右），找到类 X ，然后使用类 X 的元素内的任何元素找到具有类 Y <的元素

0,1,0,0

鉴于以上标记，以下选择器将：

 <div class="outer right">  <div class="inner left">  <div class="core right"></div> </div> </div>，NO SPACE，选择最外面的DIV（＃1）。要求.outer.right和.outer类出现在同一元素上（顺序无关紧要）。
.right，WITH SPACE，选择最内部的DIV（＃3）。要求.outer .right出现在具有.right的元素内某处的元素上。

如何在嵌套div中对齐图像＆lt;＆gt; div名称中的空格

2 个答案:

更新