CSS Articles

Page 122 of 130

CSS azimuth Property

Lakshmi Srinivas
Lakshmi Srinivas
Updated on 15-Mar-2026 160 Views

The CSS azimuth property is part of the CSS Aural style sheets specification that defines where sound should come from horizontally when content is being read aloud by screen readers or speech synthesizers. Syntax selector { azimuth: value; } Possible Values ValueDescriptionEquivalent Angle anglePosition described in terms of an angle (-360deg to 360deg)Specified angle left-sideSound from left side270deg far-leftSound from far left300deg leftSound from left320deg center-leftSound from center-left340deg centerSound from center (default)0deg center-rightSound from center-right20deg rightSound from right40deg far-rightSound from far right60deg right-sideSound from right side90deg leftwardsMoves sound 20deg ...

Read More

Set printing double-sided documents with CSS

Chandu yadav
Chandu yadav
Updated on 15-Mar-2026 650 Views

When printing double-sided documents, the page boxes on the left and right pages should be different. CSS provides pseudo-classes to define different styles for left and right pages, allowing you to set appropriate margins for binding. Syntax @page :left { /* Styles for left pages */ } @page :right { /* Styles for right pages */ } Example The following example sets different margins for left and right pages to accommodate book binding − @page ...

Read More

Orphans CSS Property

karthikeya Boyini
karthikeya Boyini
Updated on 15-Mar-2026 185 Views

In typographic terminology, orphans are lines of a paragraph stranded at the bottom of a page due to a page break, while widows are lines remaining at the top of a page following a page break. Generally, printed pages do not look attractive with single lines of text stranded at the top or bottom. Most printers try to leave at least two or more lines of text at the top or bottom of each page. The orphans property specifies the minimum number of lines of a paragraph that must be left at the bottom of a page. The ...

Read More

Controlling Pagination with CSS

George John
George John
Updated on 15-Mar-2026 508 Views

The CSS pagination properties allow you to control how content breaks across pages when printing or creating PDFs. These properties help ensure your content flows logically and looks professional in print format. Syntax selector { page-break-before: value; page-break-after: value; page-break-inside: value; } Possible Values ValueDescription autoDefault. Browser generates page breaks as needed alwaysForces a page break before or after the element avoidAvoids page breaks before, after, or inside the element leftForces page breaks to render element on a left-hand page rightForces ...

Read More

Usage of page-break-before, page-break-after, and page-break-inside properties in CSS

Samual Sam
Samual Sam
Updated on 15-Mar-2026 357 Views

CSS provides three properties to control page breaks when printing documents: page-break-before, page-break-after, and page-break-inside. These properties help you manage how content flows across printed pages, ensuring proper layout and avoiding unwanted breaks. Syntax selector { page-break-before: value; page-break-after: value; page-break-inside: value; } Possible Values PropertyValuesDescription page-break-beforeauto | always | avoid | left | rightControls page break before element page-break-afterauto | always | avoid | left | rightControls page break after element page-break-insideauto | avoidControls page break inside element ...

Read More

Paged Media in CSS

Lakshmi Srinivas
Lakshmi Srinivas
Updated on 15-Mar-2026 121 Views

Paged media differ from continuous media in that the content of the document is split into one or more discrete pages. Paged media includes paper, transparencies, pages that are displayed on computer screens, etc. The CSS2 defines a page box, a box of finite dimensions in which content is rendered. The page box is a rectangular region that contains two areas − The page area − The page area includes the boxes laid out on that page. The edges of the page area act as the initial containing block for a layout that ...

Read More

Role of size property in CSS to set the size and orientation of a page box

Ankith Reddy
Ankith Reddy
Updated on 15-Mar-2026 189 Views

The CSS size property specifies the size and orientation of a page box when printing. This property is primarily used within @page rules to control how content appears on printed pages. Syntax @page { size: value; } Possible Values ValueDescription autoThe page box will be set to the size and orientation of the target sheet landscapeOverrides the target's orientation. The longer sides are horizontal portraitOverrides the target's orientation. The shorter sides are horizontal lengthCreates an absolute page box with specified dimensions. One value sets both width and height ...

Read More

Fade In Left Big Animation Effect with CSS

karthikeya Boyini
karthikeya Boyini
Updated on 15-Mar-2026 147 Views

The CSS Fade In Left Big animation effect creates a dramatic entrance animation where an element slides in from the far left while simultaneously fading in from transparent to opaque. This effect uses translateX(-2000px) to start the element off-screen. Syntax @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; ...

Read More

Fade In Down Animation Effect with CSS

Arjun Thakur
Arjun Thakur
Updated on 15-Mar-2026 259 Views

The CSS Fade In Down animation effect creates a smooth transition where an element gradually appears while moving downward from its starting position. This animation combines opacity changes with vertical translation to create an elegant entrance effect. Syntax @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-distance); } 100% { opacity: 1; transform: ...

Read More

Fade In Left Animation Effect with CSS

Samual Sam
Samual Sam
Updated on 15-Mar-2026 211 Views

The CSS Fade In Left animation effect creates a smooth transition where an element slides in from the left while gradually becoming visible. This animation combines opacity changes with horizontal movement to create an elegant entrance effect. Syntax @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: ...

Read More
Showing 1211–1220 of 1,299 articles
« Prev 1 120 121 122 123 124 130 Next »
Advertisements