box-shadow內陰影的用法

內陰影效果(偏移值都爲正):

#box-shadow{
	-moz-box-shadow:5px 5px 5px #999 inset;               /* For Firefox3.6+ */
	-webkit-box-shadow:5px 5px 5px #999 inset;            /* For Chrome5+, Safari5+ */
	box-shadow:5px 5px 5px #999 inset;                    /* For Latest Opera */
}

內陰影效果(偏移值都爲負):

#box-shadow2{
	-moz-box-shadow:-5px -5px 5px #999 inset;             /* For Firefox3.6+ */
	-webkit-box-shadow:-5px -5px 5px #999 inset;          /* For Chrome5+, Safari5+ */
	box-shadow:-5px -5px 5px #999 inset;                  /* For Latest Opera */
}

內陰影效果(水平偏移爲負,垂直偏移爲負):

#box-shadow3{
	-moz-box-shadow:-5px 5px 5px #999 inset;              /* For Firefox3.6+ */
	-webkit-box-shadow:-5px 5px 5px #999 inset;           /* For Chrome5+, Safari5+ */
	box-shadow:-5px 5px 5px #999 inset;                   /* For Latest Opera */
}

內陰影效果(水平偏移爲正,垂直偏移爲負):

#box-shadow4{
	-moz-box-shadow:5px -5px 5px #999 inset;              /* For Firefox3.6+ */
	-webkit-box-shadow:5px -5px 5px #999 inset;           /* For Chrome5+, Safari5+ */
	box-shadow:5px -5px 5px #999 inset;                   /* For Latest Opera */
}

* 還能夠試試把某個偏移值設置爲0,這時陰影的效果就只是單邊的web

相關文章
相關標籤/搜索