单页不同尺寸的menubuttons

Question

我的页面上有3个menubuttons。我想每个人都有不同的宽度。对于这一点，我做了以下内容：

<style> 
    .ui-menu { 
    width : 180px; 
    } 
</style> 

然而，这种将所有menubuttons的宽度180像素。我想分别有180px，140px和160px的宽度。我怎样才能做到这一点？

Answer 1

你应该有每个独特的标识符（例如一个id），并用它来设计它们。或者，您可以使用CSS3 :nth-child（documentation）选择器，但它可能是为了您的需要矫枉过正。

Answer 2

试试这个：

<style> 
.ui-menu:nth-child(1){ 
width : 180px; 
} 

.ui-menu:nth-child(2){ 
width : 140px; 
} 

.ui-menu:nth-child(3){ 
width : 160px; 
} 
</style>