CSSで枠線を半透明にする方法


CSSで半透明なボーダーを作りたくなった。
こういうの。↓

枠線も半透明。背景色も半透明。
CSSで簡単に作れる。

CSS

#border {
	-moz-background-clip: padding;
	-webkit-background-clip: padding;
	background-clip: padding-box;
	background-color: rgba(255,255,255,0.9);  /* 背景の設定 */
	border: 10px solid rgba(0,0,0,0.3);  /* ボーダーの設定 */

	border-radius: 20px;  /* 角丸 */
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}