10 мая 2014
Тень css - 1
Тень css - 2
Тень css - 3
Тень css - 4
Тень css - 5
Тень css - 6
Тень css - 7
Тень css - 8
Тень css - 9
Тень css - 10
Тень css - 11
Тень css - 12
Тень css- 13
Тень css - 14
Тень css - 15
Тень css - 16

CSS-код

.Shadow div {
  margin:20px;
  padding:20px;
  text-align:center;
  font-weight:bolder;
  font-size:20px;
  background: #2b4954;
}

.ShadowBox1 {
	-webkit-box-shadow: 0 10px 6px -6px #22363f;
	-moz-box-shadow: 0 10px 6px -6px #22363f;
	box-shadow: 0 10px 6px -6px #22363f;
}
.ShadowBox2 {
	-webkit-box-shadow: 0 1px 2px #22363f;
	-moz-box-shadow: 0 2px 1px #22363f;
	box-shadow: 0 2px 1px #22363f;
}
.ShadowBox3 {
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
}
.ShadowBox4 {
	box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.3);
}
.ShadowBox5 {
	box-shadow: 0 0 1px rgba(34, 25, 25, 0.4);
}
.ShadowBox6 {
	box-shadow: 0 1px #517887 inset, 0 1px 3px rgba(34, 25, 25, 0.4);
}
.ShadowBox7 {
	box-shadow: 0 4px 2px -3px #000;
}
.ShadowBox8 {
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
}
.ShadowBox9 {
	border-bottom: 0 none;
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.46);
}
.ShadowBox10 {
	-webkit-box-shadow: 0 7px 4px #22363f;
	-moz-box-shadow: 0 7px 4px #22363f;
	box-shadow: 0 7px 4px #22363f;
}
.ShadowBox11 {
	-webkit-box-shadow: 0 3px 2px #22363f;
	-moz-box-shadow: 0 3px 2px #22363f;
	box-shadow: 0 4px 2px -3px #22363f;
}
.ShadowBox12 {
	box-shadow: 0 0.5px 0 0 #fff inset, 0 1px 2px 0 #000;
}
.ShadowBox13 {
	-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
	box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
}
.ShadowBox14 {
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.ShadowBox15 {
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.9) inset;
	border-color: #1c2f36;
	border-style: none solid solid none;
	border-width: medium 1px 1px medium;
	background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
	-moz-border-bottom-colors: none;
	-moz-border-image: none;
	-moz-border-left-colors: none;
	-moz-border-right-colors: none;
	-moz-border-top-colors: none;
}
.ShadowBox16 {
	box-shadow: 0 1px 8px 0 #192a30 inset;
	background: none repeat scroll 0 0 #284049;
}
Теги: css3, тени, shadow