Opacity refers to the transparency of an element. It ranges from 0 to 1, where:
- Opacity: 1 (default): Element is fully opaque.
- Opacity: 0.5: Element is semi-transparent.
- Opacity: 0: Element is fully transparent.
CSS Example: Adjusting Element Transparency
/* Make element semi-transparent */
div {
opacity: 0.5;
}
Enhancing Accessibility
Opacity can improve accessibility by:
- Highlighting focusable elements
- Providing visual feedback for clickable elements
- Creating overlay effects without obscuring content