0

我有网站 http://yournextleap.com/fresher-jobs 请找出最后一个具有 HTML 的 div

<div data-recommendation="" data-id="3790" data-guidance="" data-bucket="jobs">
<div class="inn">
/* Some code*/
</div>
</div>

.inn 具有虚线底部边框,它的父 div 是动态生成的

我想要的是:

  1. 最后一个 DIV .inn 必须有border: none;
  2. 我试过了:last-child
  3. 我不想使用 JS 或 Jquery

我为主 div 添加了类(暂时我删除了它);现在只有<div> 它是

<div class="main">

就是这样,这是我的CSS

.main:last-child .inn{
border: none;}

但它不工作

4

2 回答 2

2

这是我假设你有的:

    <div class="main">
        <div data-recommendation="" data-id="3790" data-guidance="" data-bucket="jobs">
            <div class="inn">
            /* Some code*/
            </div>
        </div>
    </div>

如果是这种情况,您需要:

    .main div:last_child .inn {
        border:none;
    }
于 2012-05-07T06:43:02.100 回答
1

嘿,我已经测试并在您的 css 中进行了以下更改

div.hero-unit div.recommendation + div div:last-child div.inn {border:none !important;}

它适用于 Firefox 和 Chrome 我正在测试相同的 IE 这仅适用于 IE 9+ 浏览器 IE 7 和 IE 8 将不支持此 CSS 选择器。

将在这里解释模式。

  1. div.hero-unit是选择父div
  2. div.recommendation就是选择里面的孩子div.hero-unit
  3. + div将选择下一个 div
  4. div:last-child将选择 div 中的最后一个子元素,即我们在第 3 点中选择的子元素
  5. div.inn设置属性border:none!important以便不应用其他边框,因为border:none将被赋予最高优先级,因为!important.

希望它对每次阅读都有帮助。祝你好运

于 2012-05-07T06:41:30.990 回答