css - 单个页面上不同大小的菜单按钮

Question

我的页面上有 3 个菜单按钮。我想为每个人设置不同的宽度。为此，我做了以下事情：

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

但是，这会将所有菜单按钮的宽度设置为 180 像素。我想分别有 180px、140px 和 160px 的宽度。我怎样才能做到这一点？

Answer 1

尝试这个：

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

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

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

Answer 2

您应该对每个人都有一些唯一的标识符（例如 an id）并使用它来设置它们的样式。或者，您可以使用 CSS3 :nth-child(文档) 选择器，但对于您的需求来说，这可能是多余的。