CSSでタブをデザインする

画像を使わずにCSSでタブをデザインする。

#profile-menu li a {
	font-size: 1.1em;
	background-color: #ddd;
	padding: 4px 7px;
	border-top: 3px double #9e9e9e;
	position: relative;
	top: -10px;

	-moz-border-radius-topleft: 6px;
	-khtml-border-top-left-radius: 6px;
	-webkit-border-top-left-radius: 6px;
	border-top-left-radius: 6px;

	-moz-border-radius-topright: 6px;
	-khtml-border-top-right-radius: 6px;
	-webkit-border-top-right-radius: 6px;
	border-top-right-radius: 6px;

	-moz-border-radius-bottomleft: 6px;
	-khtml-border-bottom-left-radius: 6px;
	-webkit-border-bottom-left-radius: 6px;
	border-bottom-left-radius: 6px;

	-moz-border-radius-bottomright: 6px;
	-khtml-border-bottom-right-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	border-bottom-right-radius: 6px;
}

コメントを残す