IT. Expert System.

CSS

box-shadow


Property Description

The box-shadow property attaches one or more drop-shadows to the box. The property is a comma-separated list of shadows, each specified by 2-4 length values, an optional color, and an optional inset keyword. Omitted lengths are 0.

This property has the following syntax:

box-shadow: none|h-shadow v-shadow blur spread color|inset|initial|inherit;

Property Values

Value Description
none (default) Specifies that no shadow is displayed
h-shadow (required) Specifies the position of the horizontal shadow
v-shadow (required) Specifies the position of the vertical shadow
blur (optional) Specifies the blur distance
spread (optional) Specifies the size of the shadow
color (optional) Specifies the color of the shadow
inset (optional) Specifies that the shadow should be drawn as an inner shadow
initial Specifies that the value of the property should be set to the default value
inherit Specifies that the value of the property should be inherited from the parent element

Examples

The following example shows the basic use of this property:

<pre style="border:solid 1px black;
  box-shadow:-5px -5px #888;
  -webkit-box-shadow:
    -5px -5px #888;
">
border:solid 1px black;
box-shadow:-5px -5px #888;
</pre>

This produces the following result:

 
  border:solid 1px black;
  box-shadow:
    10px 10px 5px #888;
  -webkit-box-shadow:
    10px 10px 5px #888;
            

The following examples show some various box shadow values:

 
  border:solid 1px black;
  -webkit-box-shadow:
    -5px -5px #888;
  box-shadow:
    -5px -5px #888;
  
 
  border:solid 1px black;
  -webkit-box-shadow:
    -5px -5px 5px #888;
  box-shadow:
    -5px -5px 5px #888;
  
 
  border:solid 1px black;
  -webkit-box-shadow:
    -5px -5px 0 5px#888;
  box-shadow:
    -5px -5px 0 5px #888;
  
 
  border:solid 1px black;
  -webkit-box-shadow:
    -5px -5px 5px 5px#888;
  box-shadow:
    -5px -5px 5px 5px #888;
  
 
  border:solid 1px black;
  -webkit-box-shadow:
    0 0 5px#888;
  box-shadow:
    0 0 5px #888;
  
 
  border:solid 1px black;
  -webkit-box-shadow:
    0 0 5px 5px#888;
  box-shadow:
    0 0 5px 5px #888;
  

Browser Support

Chrome Firefox IE Safari Opera
10.0
4.0 -webkit-
4.0
3.5 -moz-
9.0 5.1
3.1 -webkit-
10.5

Miscellaneous Information

Inherited: No
Defined In: CSS3
Default Value: 0


Content

Android Reference

Java basics

Java Enterprise Edition (EE)

Java Standard Edition (SE)

SQL

HTML

PHP

CSS

Java Script

MYSQL

JQUERY

VBS

REGEX

C

C++

C#

Design patterns

RFC (standard status)

RFC (proposed standard status)

RFC (draft standard status)

RFC (informational status)

RFC (experimental status)

RFC (best current practice status)

RFC (historic status)

RFC (unknown status)

IT dictionary

License.
All information of this service is derived from the free sources and is provided solely in the form of quotations. This service provides information and interfaces solely for the familiarization (not ownership) and under the "as is" condition.
Copyright 2016 © ELTASK.COM. All rights reserved.
Site is optimized for mobile devices.
Downloads: 68 / 96389433. Delta: 0.02235 с