Using gradients we can create smooth progressive color transitions. We mostly use CSS gradients for backgrounds, but it is possible to add a gradient color transition to text as well. However, it requires some extra steps to achieve it. We have ...
Continue reading
Pseudo-elements and Classes
In this article we will look at pseudo elements and pseudo classes. We will learn what they are, how to use them and what's the different between them. What are Pseudo-classes? A CSS pseudo-class is a special keyword added to selectors that ...
Continue reading
CSS Transitions
The CSS transition property is one of the most powerful tools you have at your disposal to create fluid, graceful animations on your web pages. With just a few lines of code, you can add subtle motion that makes your ...
Continue reading The CSS Transform Property
The CSS transform property is used to specify two-dimensional or three-dimensional transformation of an element. This property can be used to rotate, scale, translate, or skew an element on a webpage. The transform property is specified as a list of ...
Continue reading CSS Gradients
With CSS gradients we can create transitioning color effects when one or more colors fade into each other. In order to create a gradient, we need to use the "background-image" property. CSS gradients come in three forms. linear gradients It is created ...
Continue reading CSS Positioning Elements
The HTML elements on a webpage are displayed where we place them, but with the CSS "position" property we can move them around. By default the position property of an element is "static", but we can assign other values to ...
Continue reading CSS Padding
The CSS padding property is used to add space around an element inside its borders. It defines the deepest level of the CSS box model. With CSS we can be very precise with paddings. Specifying the sides for padding: We can set ...
Continue reading CSS Margins
In CSS the margin is the outermost layer of HTML elements, it adds space around them as opposed to padding which adds space inside an element, around its content. With CSS we can be very precise with margins. Specifying the sides ...
Continue reading The CSS first selectors
In this articles we will look at selectors that do something with the first elements or characters. They are pseudo classes or elements. Let's take a look at them one by one. :first-child The "first-child" pseudo-class selector allows you to select the ...
Continue reading The CSS Box Model
The CSS box model describes the display of objects in a web page. According to this, everything that is displayed is inside a rectangular box. Web browsers generate such rectangular boxes for every HTML elements, for example: divs, paragraphs, tables, ...
Continue reading