CSS类不适用于

Question

我想将CSS类washes_times_links应用于下面的html，但由于某种原因，它不起作用。

.washes_times_links a { 
 
    display: block; 
 
    padding: 15px; 
 
    padding: 13px; 
 
    text-align: center; 
 
    color: #3b524b; 
 
    font-size: 15px; 
 
    text-transform: capitalize; 
 
} 
 

 
.washes_times_links a:nth-child(odd) { 
 
    background-color: #fff; 
 
} 
 

 
.washes_times_links a:last-child { 
 
    border-radius: 0 0 5px 5px 
 
} 
 

 
.washes_times_links a:hover { 
 
    color: #fff; 
 
    background-color: #12be9c; 
 
}

<p class="washes_times_links"> 
 
    <a href="http://hairactivation.com/male-hairloss-treatment/#wash-hair-less-5-days-week">1 time a week</a> 
 
    <a href="http://hairactivation.com/male-hairloss-treatment/#wash-hair-less-5-days-week">2 times a week</a> 
 
</p>

Answer 1

它看起来不错。 检查此属性中的css属性：[https://jsfiddle.net/nf0a5gq7/][1]，您将看到所有css属性都已应用，但缺少'border'属性（在.washes_times_links a：last-child中），这就是为什么你不能看到的边界..

Answer 2

一般来说，以一种方式对任何人在这里交叉有用。

要在奇/偶选择适用风格：

.class_name a:nth-child(odd) { 
    background-color: #ffff99; 
} 
.class_name a:nth-child(even) { 
    background-color: #b8d1f3; 
} 

申请半径/样式首/末选择：

.class_name a:first-child { 
    border-radius: 5px 5px 0 0; 
} 
.class_name a:last-child { 
    border-radius: 0 0 5px 5px; 
} 

一起：

HTML

<p class="class_name"> 
    <a href="#1">1st row</a> 
    <a href="#2">2nd row</a> 
    <a href="#3">3rd row</a> 
    <a href="#4">4th row</a> 
</p> 

CSS

.class_name a { 
    /* default links styles */ 
} 
.class_name a:nth-child(odd) { 
    background-color: #ffff99; 
} 
.class_name a:nth-child(even) { 
    background-color: #b8d1f3; 
} 
.classname a:first-child { 
    border-radius: 5px 5px 0 0; 
} 
.class_name a:last-child { 
    border-radius: 0 0 5px 5px; 
} 
.class_name a:hover { 
    color: #fff; 
    background-color: #12be9c; 
} 

Tip: How do I ask a good question?