How can I set the opacity property on a button element that has a disabled attribute?

5862
february 22, 2023, at 11:15

You can set the opacity property on a button element that has a disabled attribute using CSS. Here's an example:

HTML

CSS

In this example, the button element has the "disabled" attribute, which means it cannot be clicked. The CSS selector button[disabled] targets the disabled button element specifically, and sets the opacity property to 0.5, which gives it a semi-transparent appearance.

You can adjust the opacity value to suit your needs. Keep in mind that setting the opacity property affects the entire button, including any text or icons inside it. If you want to make only the background or border of the button semi-transparent, you may need to use other CSS properties, such as background-color or border-color.