如何自定义语义UI按钮（背景颜色，边框半径和所有）

Question

如何自定义语义UI按钮（背景颜色，边框半径和全部）

The request body isn't either a blob or an array buffer

以上代码无效

Answer 1

您需要使自定义属性比语义使用的更具体。特异性如何工作（简单）是当同一元素上存在竞争属性值时，选择更具“特异性”的属性值。

阅读本文以了解有关CSS特异性的更多信息：https://developer.mozilla.org/en/docs/Web/CSS/Specificity

针对您的特定问题：

使自定义CSS更具体的一种方法是在页面的body标签中使用id并使用以下选择器：

方法1

#bodyid .create-new-menu-btn {
    //Properties
}

另一种方法是简单地将id添加到您要选择的元素

方法2

#create-new-menu-btn {
}

如果要在多个元素上应用属性（因此使用类）（如页面上的多个注释按钮），首选方法1

当要选择单个元素时，首选方法2。 （如标题中的登录/注册按钮）

Answer 2

#bodyId .ui.create-new-menu-btn {
border-radius: 0;
background-color: red;

}

它将使用 ui 类定位所有按钮。

希望它会很有用：）

Answer 3

您也可以在自己的特殊性之前添加语义ui的类。 例如：如果您的 className 是.create-new-menu-btn，您可以在ui.button之前添加css或scss，或者您需要的任何其他语义ui特定的clas。所以最后，你在css中的类定义看起来像这样：

ui.button.create-new-menu-btn {
  ....
}

Answer 4

如果使用JSX，则可以对目标元素使用内联样式

示例：

<Button style={{backgroundColor: 'red', borderRadius: 0}}> View Created </Button>

Answer 5

将.ui.button放在班级名称create-new-btn的前面。看起来应该像下面的

.ui.button.create-new-btn {
  //Your css code
}

然后在html / jsx模板中，可以使用类名create-new-btn，如下所示：

<Button class="create-new-btn"/>
or for Jsx
<Button className="create-new-btn"/>