×

CSS Opacity

The CSS Opacity property is used to set the clarity of the image. It is defined as degree and specify the transparency of an element.

Note: Opacity value will be less than 1.

Let us see an example of CSS opacity:

<!DOCTYPE html>    
<html>    
<head>    
<style>    
img.traspar{    
    opacity: 0.5;    
    filter: alpha(opacity=40); /* For IE8 and earlier */    
}    
</style>    
</head>    
<body>    
<p>without Opacity Image</p>    
<img src="image/opacity-img.png">    
<p>Transparent Image</p>    
<img class="traspar" src="image/opacity-img.png">    
</body>    
</html>


Related Topics

CSS Font

CSS Font: CSS has font property, which makes the text more attractive. We can alter the entire look by changing font color, font size, font style, and much more. In...

5 minutes read.

CSS Line Height

CSS Line Height: This property in CSS can be used to describe the line box’s minimal height inside the element. It sets-up the distinction among two lines in our content. It...

3 minutes read.

CSS Word Wrap

Word Wrap in CSS: The word-wrap property in CSS is referred to break any lengthy word and wrap towards the next or following line. It is employed for preventing overflow...

1 minute read.

CSS Content Property

Content Property The content attribute produces dynamic content. It can be applied with any pseudo-element ::after and ::before. These CSS properties are entirely supported inside every browser and applied to include...

5 minutes read.

CSS Pseudo-elements

Pseudo-elements The pseudo-classes in CSS can be represented as any keyword which is connected to the selector that represents any selected element’s unique state. On the other hand, pseudo-elements can be...

6 minutes read.

CSS calc()

CSS calc(): The CSS calc() function is a CSS function of inbuilt type, which permits us to implement calculations. It is used for calculating the angle, integer frequency, number, time,...

3 minutes read.

CSS Text-Transform Property

Text-Transform in CSS The text-transform property permits us to alter the text case. It controls the capitalization of the text. This property is employed to design the text appearance in every...

3 minutes read.

CSS Button Style

CSS button style: Using CSS properties, we can easily modify the default BUTTON and enhance its appearances using simple graphic commands. TYPES OF BUTTON STYLE: - Program to change button using CSS ...

35 minutes read.

Radial-gradient() CSS function

Radial-gradient() CSS function It defines a CSS in-built function, which produces a smooth transition among multiple colors. It is used to set any radial-gradient that is same as a background-image. This...

4 minutes read.

CSS @keyframes rule

CSS @keyframes rule It describes the rule of animation that depicts the properties of CSS for the components at every state along with the timeline. We may make the properties of complex...

4 minutes read.

CSS translate() Function

Translate() CSS function This function in CSS is a CSS in-built function. It relocates the element in the horizontal direction or in the vertical direction. It can move the items from...

2 minutes read.

CSS Background Color

It is one of the CSS properties to apply styling to html elements.This property is used to apply the background color to any HTML element.The background of an element includes...

2 minutes read.

Hover condition for a:before and a:after in CSS

In CSS, :after and :before are used to add content after and before the element. The CSS pseudo-class is used to add some styling effect to the webpage. We can change...

4 minutes read.

CSS Pseudo-class

Pseudo-class The pseudo-class may be depicted as the keyword which can be mixed to any selector that specifies the elected element’s unique state. It can be included to a selector to...

6 minutes read.

CSS Browser Support

The desk underneath lists of all CSS properties and the way each belongs to it is supported in the generally unique browsers: - The quantity to the right of the browser...

2 minutes read.

How to use google fonts in CSS

Fonts: - Fonts are used to make our website look more beautiful. Choosing appropriate font according to the web design or layout is also important. Many typefaces are accessible in...

4 minutes read.

CSS Opacity

The CSS Opacity property is used to set the clarity of the image. It is defined as degree and specify the transparency of an element. Note: Opacity value will be less...

1 minute read.

CSS 3D Transform

Introduction To understand 3D transformation property of transform you need to first understand the difference between 2D and 3D transform. 2D transform is a CSS effect which transforms the elements according to...

6 minutes read.

How To Use CSS

You can use CSS(Cascading Style Sheet) in four ways. These are given below: The given above CSS type, in which various technique will be used. These are different from each other and...

2 minutes read.

CSS Arrow

CSS Arrow The arrow of CSS is applied to insert an array with the tooltip. It can make a tooltip as any speech bubble. Also, this arrow can be illustrated in...

4 minutes read.