What should every CSS3 developer know? | CSS3 | Web Design

1. Display:-

The display CSS property sets whether an element is treated as a block or inline element and the layout used for its children, such as flow layout, grid or flex.

• block :
• inline : 
• inline-block :none : 

2. Margin and Padding :-

Margins and Paddings dictate the spaces between elements on your website. They are very similar and have the same units. The only difference between margins and paddings is the area the exert control over. Margins affect the area outside of borders whereas paddings affect areas inside the border.

3. Border

Border properties simply allows you to specify how the border of your content should look like.

There are three properties of a border you can change −

• The border-color specifies the color of a border.
• The border-style specifies whether a border should be solid, dashed line, double line, or one of the other possible values.
• The border-width specifies the width of a border.

4. Background

CSS background property allows us to specify background effects on an element.

There are 5 background properties that affects an HTML element –

• background-color
• background-image
• background-repeat
• background-attachment
• background-position

5. Position

• static
• absolute
• fixed
• relative
• sticky
• initial

6. Transform

Transform contains multiple properties like rotate, scale, translate. You can make any element double size using scale property.

7. Hover

One of the most Exciting properties of CSS is Hover property.

8. nth-child property

We can select any specific element using this property corresponding to its parent and can apply CSS to that element. 

9:after, :before

A CSS pseudo-element is used to style specified parts of an element. It always has a big role in designing. We can do different styling using pseudo-elements.

10 Filter

The filter CSS property applies graphical effects like blur or color shift to an element. Filters are commonly used to adjust the rendering of images, backgrounds, and borders.