CSS Course
About Lesson

The box-shadow property in CSS is used to give a shadow-like effect to the frames of an element. The multiple effects can be applied to the element’s frame which is separated by the comma. The box-shadow can be described using X and Y offsets relative to the element, blur and spread radius, and color.

Default Value : Its default value is none. 

Property Value:  All the properties are described well with the example below.

  • h-offset: It is required to set the position of the shadow horizontally. The positive value is used to set the shadow on the right side of the box and a negative value is used to set the shadow on the left side of the box.
  • v-offset: It is required to set the position of shadow value vertically. The positive value is used to set the shadow below to the box and a negative value is used to set the shadow above the box.
  • blur: It is an optional attribute, the work of this attribute is to blur the shadow of the box.
  • spread: It is used to set the size of the shadow. The size of the spread depends on the value of the spread.
  • color: It is an optional attribute and is used to set the color of the shadow.
  • inset: By default, the shadow generates outside the box. But using the inset, we can create the shadow inside the box.
  • initial: It is used to set the box-shadow property to its default value.
  • inherit: This property is inherited from its parent.
Exercise Files
No Attachment Found
No Attachment Found
Join the conversation

Introducing Official ApeStaking Protocol for ApeCoin.

New Blur NFT Marketplace Courting Professional.