Author: majadc
-
SVG
SVG – Scalable Vector Graphics – it is a two dimensional vector graphics. SVG images are created using XML markup language and can be easily edited, searched, indexed, scripted, and compressed without losing their quality. A vector graphic is a type of computer graphic that is created using mathematical equations to define lines, shapes, and […]
-
CSS Flecbox: flex-wrap
flex-wrap is a CSS property that controls whether flex items are forced onto a single line or can wrap onto multiple lines within a flex container. Syntax See the Pen Flexbox: flex-wrap by majadc (@majadc) on CodePen. Related Resources
-
CSS Flexbox: flex-direction
The flex-direction property controls the directions of main axis of a flex container, with the cross axis being perpendicular to it. This property also allows flex items to be rearranged in either the reverse or the default order. The flex-direction property is applied to the flex parent, i.e. the element with display: flex or display: […]
-
CSS Flexbox: align-content
The align-content property in CSS Flexbox is used to align multiple rows of flex items along the cross axis of the container (vertically if the flex-direction property is set on row). It applies only when flex-wrap property is set to wrap. stretch 1 2 3 4 5 6 7 8 9 10 11 12 13 […]
-
CSS Flexbox: align-items
The align-items property in CSS Flexbox is used to control how flex items are positioned along the cross axis of the flex container (vertically if the flex-direction property is set on row). stretch (default) 1 2 3 4 5 6 7 8 9 10 11 12 flex-start 1 2 3 4 5 6 7 8 […]
-
CSS Flexbox: justify-content
The justify-content property property is used on a flex container. It decides how the items inside are spaced out along the main axis – usually from left to right, unless the direction is changed (horizontally – if flex-direction property is set on row). After the browser figures out things like margins and how much space […]
-
Blend modes
Blend modes allow you to blend colors from two or more layers, which can be background images or background colors. This CSS data type can be used in the background-blend-mode and mix-blend-mode properties. Syntax Blend modes Darken type multiply darken color-burn Lighten type screen lighten color-doge Contrast type overlay hard-light soft-light Composite type hue saturation […]
-
Radial gradient
The CSS radial-gradient is used to draw a background image that represents smooth transitions between colors in in a circular or elliptical shape.
-
Linear gradient
The CSS linear-gradient is used to draw a background image that represents smooth transitions between colors along a straight line.
-
Multiple backgrounds
It is possible to apply multiple backgrounds to an element including images and gradients.