DEV Community

Mahamud Pino
Mahamud Pino

Posted on

CSS TOPICS

                CSS  TOPICS                         
Enter fullscreen mode Exit fullscreen mode

*Animation CSS: *

An open source online pre-made animation file. In our project sometimes we use some animation which makes our project more beautiful. Animation files are too small and we can use them very easily. There are many animation libraries we can find online. There are many online sites but [https://animate.style] is one of the most common online sites for animation.

*Tailwind CSS: *

Tailwind CSS is one of the most popular frameworks. Using this library we can easily handle our project. Bootstraps is also a popular CSS library framework and we have been using this library for several years but in 2017 Tailwind CSS first time release and in this short time we can see that there are many advance code already done for us and I hope this CSS library will be more popular in future. Using this framework we can easily design our project.

*Media Queries: *

Media queries are also very important to customize our design layout. Very easy to use and we can handle this very easily. Actually media queries are needed when we use the smallest resolution display monitor just like phones and tabs. Using media queries we can handle the whole project.

*CSS 3D Transforms: *

This is also a powerful feature in CSS. Sometimes we use this in our project. Using this we can easily shifted, slanted, and rotate our small project design. Also we can design 3D transforms and add a new dimension to traditional websites.

*Box Model: *

We use it to design our website layout page. There are four parts. When we use this in our browser we can easily control our layout design to fixed content, padding, border and margin. This is very essential to customize our design.

*Scroll Snapping: *

This is also one of the advanced CSS techniques. Using this developer control scroll experiences. Normally we use this to page or photo scroll. This scroll-snap-type decides scrolling x or y.
Gradients:

*Gradients: *

We use it to create smooth transitions between color without having to resort to images. This is a little tool to make our design page more colorful. We can find many gradient color codes online. It is determined by an angle or direction. It is defined by the center of the box containing the gradient image and by an angle. The colors of the gradient are determined by two or more points. One is the starting and the other is the ending point.

*Z-Index: *

A CSS property that defines the order of overlapping Html elements. Elements with a higher index will be placed on top of elements with a lower index.

Top comments (0)