Css 在td中选择div

如果我在一个

中有两个

，我可以选择每一个吗

例如，我想让第一个浮点数向左，第二个浮点数向右。是否可以只使用CSS

.divE:first-child { float:left; }
.divE:last-child  { float:right; }

HTML

asdasd
内容

您可以尝试一下：

：第n个子项（2）

但是您使用的是CSS3，因此请确保根据需要使用您的站点的用户检查浏览器兼容性：

---

：第n个孩子

很神奇

td div.divE {
    float: left;
}

td div.divE:nth-child(2n) { /* all even divs */
    float: right;
}

/* or just use "even" */
td div.divE:nth-child(even) {
    float: right;
}

适用于所有真实浏览器。意思是，没有IE8及以下

---

更多信息：

在这种情况下

：第一个孩子必须是
下的第一个元素，该选择器才能工作（这是
所以
。红色：第一个孩子
可以工作）

您可以使用

我在html中添加了一个div元素，它可以正常工作

css

html


asdasd
蓝色
红色
内容
使用组合的
：第一个子
选择器和
同级选择器允许您以第二个
div
为目标，如下所示：

.red{
    float: left;
}
.divE{
    float: left; //this is for the second .divE
}
.red + .divE{
    float: right; //this is for the first .divE
}

这样的解决方案从IE7开始就可以使用。
是的，它是：）

默认情况下，您可以将.divE类设置为向左浮动，然后使用相邻的同级选择器定义，当divE类的一个div紧跟在divE类的另一个div之后时，它应该向右浮动，如下所示：

.divE {
    float:left;
}

.divE + .divE {
    float: right !important;
}

.floatLeft {
float: left;
}

.floatRight {
float:right;
}

但是仅仅给每个div一个id，然后为每个div设置float不是更容易吗？或者只对div应用.floatRight或.floatLeft类，然后更改这些类的浮动？通过这种方式，您可以重用这些类

如果将HTML更改为：

<table id="myTbl" cellpadding="0" cellspacing="0">
<tr>
    <td colspan="3" width="25%">
    <div class="red">asdasd</div>
    <div class="divE floatLeft"></div>
    <div class="divE floatRight"></div>
    content
    </td>
</tr>

对于特定类的第一个子类，您可以检查。但是，如果您的所有表格单元格都包含类似的结构，您可以尝试第n个子项（n），如下面的答案所示。它甚至不是一个组合，只是
同级

.red{
    float: left;
}
.divE{
    float: left; //this is for the second .divE
}
.red + .divE{
    float: right; //this is for the first .divE
}

.divE {
    float:left;
}

.divE + .divE {
    float: right !important;
}

<table id="myTbl" cellpadding="0" cellspacing="0">
<tr>
    <td colspan="3" width="25%">
    <div class="red">asdasd</div>
    <div class="divE floatLeft"></div>
    <div class="divE floatRight"></div>
    content
    </td>
</tr>

.floatLeft {
float: left;
}

.floatRight {
float:right;
}