CSS text-shadow

• CSS – Introduction
• CSS – Basics
• CSS – Include CSS File to HTML
• CSS – ID and Class
• CSS – Cascading Order
• CSS – Selector
• CSS – Pseudo Classes
• CSS – Colors
• CSS – Gradients
• CSS – Units
• CSS – Background
• CSS – Border
• CSS – Margin and Padding
• CSS – Height and Width
• CSS – Outline
• CSS – Display and Visibility
• CSS – Position
• CSS – Overlapping Elements
• CSS – Overflow
• CSS – Float
• CSS – Clear and Clearfix
• CSS – Left and Right
• CSS – Transform
• CSS – Opacity / Transparency
• CSS – text-shadow
• CSS – box-shadow
• CSS – object-fit
• CSS – Counters
• CSS – Variables
• CSS – Fonts
• CSS – Text Formatting
• CSS – Graphics
• CSS – Links
• CSS – Lists
• CSS – Tables
• CSS – Horizontal & Vertical Align
• CSS – Image Sprite
• CSS – Transitions
• CSS – 2D Transforms
• CSS – 3D Transforms
• CSS – Animations
• CSS – Media Queries
• CSS – Flexbox

text-shadow

CSS text-shadow is a powerful feature of CSS that allows you to add shadows to text on web pages. It is a great way to add depth and dimension to your text, making it stand out from the rest of the page. It can also be used to create interesting effects, such as 3D text.

The text-shadow property is part of the CSS3 specification, and is supported by all modern browsers. It is a relatively simple property to use and can be used to create a wide variety of effects.

The text-shadow property adds a shadow to the text. It accepts a comma-separated list of shadows to be applied to the text and any of its decorations.

The syntax for the text-shadow property is:

text-shadow: offset-x offset-y blur-radius color

The offset-x and offset-y values specify the position of the shadow relative to the text. A positive value for offset-x will move the shadow to the right, while a negative value will move it to the left. A positive value for offset-y will move the shadow downwards, while a negative value will move it upwards.

The blur-radius value specifies the amount of blur applied to the shadow. A value of 0 will create a sharp, defined shadow, while a higher value will create a more diffuse shadow.

The color value specifies the color of the shadow. This can be either a named color or a hexadecimal color value.

h1 {
   text-shadow: 4px 2px blue;  
}