Javeria Mohsin

CSS tooltip refers to a popup message that appears after a mouse hover, or when elements get keyboard focus. It disappears on mouse out, or when the element loses keyboard focus. CSS Tooltip-Positions Top of the element Left side of the element Right side of the element Bottom of the element Right side of the … Read more

CSS object-fit property defines how an element responds to the height and width of its content box. It sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container. Object-fit values fill: this is the default value which stretches the image to fit the content box, regardless of its aspect-ratio. … Read more

CSS flex box is a whole module and not a single property, it involves a lot of things including its whole set of properties. Some of them are meant to be set on the container (parent element, known as “flex container”) whereas the others are meant to be set on the children (said “flex items”). CSS … Read more

CSS image reflection is used to reflect an image. The box-reflect property is used to create an image reflection. CSS Image reflection-properties CSS  box-reflect property values are given below below above left  right. Examples See the below effect : Gradient property It helps us to create a fade out effect on a reflected image Offset property It helps … Read more

CSS variables var( ) is a CSS function that can be used to insert the value of a custom property. CSS Variables-values Values <custom-property-name> A custom property’s name represented by an identifier that starts with two dashes. Custom properties are solely for use by authors and users; CSS will never give them a meaning beyond what is presented here. … Read more

CSS layers refer to applying the z-index property to elements that overlap with each other. The z-index property can be specified with an integer value (positive, zero, or negative), which represents the position of the element along the z-axis. CSS Layers (z-index) The z-index property, when used in conjunction with the position property, enables you to specify which element should appear on top … Read more

CSS transitions provide a way to control animation speed when changing CSS properties. Instead of having property changes take effect immediately, you can cause the changes in a property to take place over a period of time. CSS Transition-Properties Following are the properties: transition transition-delay transition-duration transition-timing-function Transition-Delay Transition-delay property specifies a delay (in seconds) for the … Read more

CSS media types can be used to apply part of a style sheet based on the result of one or more media queries. CSS Different Media Types The following table lists the various media types that may used to target different types of devices such as printers, handheld devices, computer screens etc. Media Type Description all Used … Read more

CSS positioning property sets how an element is positioned in a document. For example: CSS Positioning– values static: every element has a static position by default, so the element will stick to the normal page flow. So if there is a left/right/top/bottom/z-index set then there will be no effect on that element. relative: an element’s original position … Read more

CSS visibility property shows or hides an element without changing the layout of a document. CSS Visibility-values visible: It is the by default value. It specifies that the element is visible. hidden: It specifies that the element is invisible (but still takes up space). collapse: It is used only for table elements. It is used … Read more