Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Articles by Lakshmi Srinivas
Page 8 of 24
Add special colored corner to body or text in CSS
CSS rounded corners are used to add special colored corners to body or text by using the border-radius property. This property allows you to create smooth, curved corners instead of the default sharp rectangular edges. Syntax selector { border-radius: value; } Possible Values ValueDescription lengthDefines the radius in px, em, rem, etc. %Defines the radius as a percentage of the element's dimensions initialSets the property to its default value inheritInherits the property from its parent element Example: Basic Rounded Corners The following example creates a colored ...
Read MoreCSS stress property
The CSS stress property is part of CSS Speech Module and controls the stress level in speech synthesis. It specifies the height of "local peaks" in the intonation contour of a voice, affecting how emphasized certain words or syllables sound when content is read aloud by screen readers or speech synthesis engines. Syntax selector { stress: value; } Possible Values ValueDescription numberA value between 0 and 100. Higher values create more stress/emphasis in speech inheritInherits the stress value from parent element Example: Different Stress Levels The ...
Read MoreCSS azimuth Property
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 MorePaged Media in CSS
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 MoreWhat is a page box in CSS?
A page box in CSS is a rectangular area that defines the printable region of a page when creating print stylesheets. It consists of the page area (where content appears) and the margin area around it. Page boxes are defined using the @page rule and allow you to control page dimensions, orientation, margins, and printing marks. Syntax @page { size: width height; margin: value; marks: crop | cross | none; } Page Box Properties PropertyDescription sizeSets the page box dimensions and ...
Read MoreCSS pitch property
The CSS pitch property specifies the average pitch (frequency) of the speaking voice in speech synthesis. The average pitch varies based on the voice family − for example, a standard male voice averages around 120Hz, while a female voice averages around 210Hz. Syntax selector { pitch: value; } Possible Values ValueDescription frequencySpecifies the average pitch in hertz (Hz) x-lowExtra low pitch relative to voice family lowLow pitch relative to voice family mediumMedium pitch relative to voice family (default) highHigh pitch relative to voice family x-highExtra high pitch relative to ...
Read MoreAchieve X-Ray effect with CSS
The X-Ray effect in CSS is an Internet Explorer specific filter that converts colors to grayscale and flattens the color depth, creating a distinctive visual appearance similar to an X-ray image. Syntax selector { filter: Xray; } Parameters Parameter Description Xray Grayscales and flattens the color depth of the element Example The following example demonstrates how to apply the X-Ray filter effect to both images and text − .xray-image { ...
Read MoreAchieve Glow Effect with CSS Filters
The CSS glow effect is a visual technique used to create a luminous halo around elements. This effect makes objects appear to emit light and can be achieved using the drop-shadow filter or box-shadow properties. Syntax /* Using drop-shadow filter */ selector { filter: drop-shadow(0 0 blur-radius color); } /* Using box-shadow */ selector { box-shadow: 0 0 blur-radius color; } Parameters ParameterDescription blur-radiusThe amount of blur for the glow effect (in px) colorThe color of the glow (hex, rgb, or named colors) spread-radiusOptional: ...
Read MoreFade Out Down Animation Effect with CSS
The fade out down animation effect makes an element gradually disappear while moving downward. This creates a smooth exit animation that combines opacity reduction with downward translation. Syntax @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(distance); } } .element { ...
Read MoreFade Out Left Animation Effect with CSS
The fade out left animation effect smoothly moves an element to the left while reducing its opacity to zero, creating a disappearing effect that slides leftward. This animation combines translation and opacity changes for a smooth exit transition. Syntax @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; ...
Read More