• ADS

 • CSS

 • EXCEL

 • IMAGE-SERVER

 • SCRIPTS

 • SEO

 • WEB-PAGE-LANGUAGES

 • WEB-SERVER

 • WEBSITE-MONITORING-AND-BACKUP

W3.CSS Effects

Effect Classes

W3.CSS provides the following effects classes:

• w3-opacity: Adds opacity/transparency to an element (opacity: 0.6)
• w3-opacity-min: Adds opacity/transparency to an element (opacity: 0.75)
• w3-opacity-max: Adds opacity/transparency to an element (opacity: 0.25)
• w3-grayscale: Adds a grayscale effect to an element (grayscale: 75%)
• w3-grayscale-min: Adds a grayscale effect to an element (grayscale: 50%)
• w3-grayscale-max: Adds a grayscale effect to an element (grayscale: 100%)
• w3-sepia: Adds a sepia effect to an element (sepia: 75%)
• w3-sepia-min: Adds a sepia effect to an element (sepia: 50%)
• w3-sepia-max: Adds a sepia effect to an element (sepia: 100%)
• w3-hover-opacity: Adds transparency to an element on hover (opacity: 0.6)
• w3-hover-grayscale: Adds a grayscale effect to an element on hover (grayscale: 100%)
• w3-hover-sepia: Adds a sepia effect to an element on hover

Examples

• Using class w3-opacity: View example (67)
• Using class w3-grayscale: View example (68)
• Using class w3-sepia: View example (69)
• Using classes w3-hover-opacity, w3-hover-grayscale & w3-hover-sepia View example (70)