我正在为我的妻子整理一个网页,但我遇到了一个我无法弄清楚的 CSS 问题。我有一个图像滑块(RoyalSlider),我希望它周围没有空白,但是滑块 div 之前的各种嵌套 div 添加了填充、边距和边框。类和类中的格式在页面上的多个位置使用,所以我不能简单地更改每个元素而不破坏页面的其他元素,我更愿意这样做而不弄乱 PHP。
下面是导致格式化的 div,用标签表示它们是如何嵌套的,每个 div 下面是 div 的 CSS 格式。
<div class="container">
#section-content .container {
padding-top: 20px;
}
#section-content .container {
border-left: 10px solid white;
border-right: 10px solid white;
}
<div class="eleven columns content sixteen no-thumbnail">
.content {
padding: 10px 0 0;
}
.column, .columns {
float: left;
display: inline;
margin-left: 10px;
margin-right: 10px;
}
<div class="the_content post type-post hentry excerpt clearfix">
.content .hentry {
padding-bottom: 15px;
}
<div class="royalSlider">
<div class="rsOverflow">
<div class="rsContainer">
我认为我可以用一堆 > (或其他东西......我的 CSS 技能很初级)来指定当 RoyalSlider div 存在时它将覆盖所有其他规则,但我无法弄清楚如何去做吧。
该页面的 URL 在这里:
http://rachelhappen.com/high-res-royal-test-post/
这是一张图片,展示了它现在的样子,我希望它是什么样的,以及 CSS 格式化方式的颜色编码图形。
(来源:rachelhappen.com)
任何帮助将不胜感激。