Javeria Mohsin 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 Text effects are used to add special effects to text. We will talk about the following: text-overflow word-wrap word-break writing-mode CSS Text effects-Overflow The CSS Text effects-overflow property sets how hidden overflow content is signaled to users. It can be clipped, display an ellipsis (‘…‘), or display a custom string. CSS Text effect-word wrap CSS … Read more
CSS Specificity is the set of the rules applied to CSS selectors in order to determine which style is applied to an element. The more specific a CSS style is, the higher point value it accrues, and the likelier it is to be present on the element’s style. CSS Specificity-Calculation Specificity is a weight that … Read more
CSS aural media is used to specify a block of CSS that applied only when the content is being presented using a speech synthesis device. You can see the output below: CSS Aural media-uses It can be used by following: Used by blind or visually impaired people Help users learning to read and right pronunciation … Read more
CSS Media queries are used to modify site or app depending on a device’s general type. CSS Media Queries-Uses Media queries used to check following things: width and height of the viewport width and height of the device orientation (is the tablet/phone in landscape or portrait mode?) resolution Media Queries-syntax CSS media query is composed of … Read more
CSS Overflow property specifies whether to clip the content or to add scrollbars when the content of an element is too big to fit in the specified area. Overflow options include clipping, showing scrollbars, or displaying the content flowing out of its container into the surrounding area. In order for overflow to have an effect, the block-level container … Read more
A pseudo-class is a selector that selects elements that are in a specific state, e.g. they are the first element of their type, or they are being hovered over by the mouse pointer. They tend to act as if you had applied a class to some part of your document, often helping you cut down … Read more
CSS inline block allows to set a width and height on the element. Also, with display: inline-block, the top and bottom margins/paddings are respected, but with display: inline they are not. Compared to display: block, the major difference is that display: inline-block does not add a line-break after the element, so the element can sit next to other elements. The following example … Read more
CSS Align module aims to create a consistent method of alignment across all of CSS. This document details the general concepts found in the specification. CSS Align-Centre To horizontally center a block element (like <div>), use margin: auto; Setting the width of the element will prevent it from stretching out to the edges of its container. … Read more
CSS Counters let you adjust the appearance of content based on its location in a document. For example, you can use counters to automatically number the headings in a webpage. Counters are, in essence, variables maintained by CSS whose values may be incremented by CSS rules to track how many times they’re used. CSS Counters-properties CSS … Read more
