Category CSS

CSS Colors

CSS supports 140+ color names, HEX values, RGB values, RGBA values, HSL values, HSLA values, and opacity. RGBA Colors RGBA color values are an extension of RGB color values with an alpha channel – which specifies the opacity for a…

CSS Multiple Backgrounds

In this chapter you will learn how to add multiple background images to one element. You will also learn about the following properties: background-size background-origin background-clip CSS Multiple Backgrounds CSS allows you to add multiple background images for an element,…

CSS Border Images

CSS Border Images With the CSS border-image property, you can set an image to be used as the border around an element. CSS border-image Property The CSS border-image property allows you to specify an image to be used instead of…

CSS Rounded Corners

CSS Rounded Corners With the CSS border-radius property, you can give any element “rounded corners”. Example #rcorners1 {   border-radius: 25px;   background: #73AD21;   padding: 20px;   width: 200px;   height: 150px; } #rcorners2 {   border-radius: 25px;   border: 2px solid #73AD21;   padding: 20px;   width:…

CSS Math Functions

The CSS math functions allow mathematical expressions to be used as property values. Here, we will explain the calc(), max() and min() functions. The calc() Function The calc() function performs a calculation to be used as the property value. CSS…

CSS !important Rule

What is !important? The !important rule in CSS is used to add more importance to a property/value than normal. In fact, if you use the !important rule, it will override ALL previous styling rules for that specific property on that…

CSS Specificity

What is Specificity? If there are two or more CSS rules that point to the same element, the selector with the highest specificity will “win”, and its style declaration will be applied to that HTML element. Think of specificity as…

CSS Units

CSS Units CSS has several different units for expressing a length. Many CSS properties take “length” values, such as width, margin, padding, font-size, etc. Length is a number followed by a length unit, such as 10px, 2em, etc. Example Set…

CSS Counters

CSS counters are “variables” maintained by CSS whose values can be incremented by CSS rules (to track how many times they are used). Counters let you adjust the appearance of content based on its placement in the document. Automatic Numbering…