googleanalytics上用CSS控制的1像素圆角样式

作者:admin 日期:2008-12-21

字体大小: 小中大

请进入日志再运行

HTML代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>google analytics buttons</title>
<style type="text/css">
/* default stuff */
body {padding:20px; font-family:arial; text-align:center;}
p, li {font-size: 12px; line-height:18px;}
h3 {margin-bottom:6px;}
.examplesGoHere {text-align:left; margin:0 auto; }
.letsGiveItAFixedWidthOf200Pixels { width:200px; }
ul {list-style:none;margin-left:0;padding-left:0;margin-top:0;}
ul li {margin-bottom:8px; margin-left:0;padding-left:0; }
/* notched effect for links in the unordered list */
.notchedListItems a {
	display:block;
	border: solid #666;
	border-width: 0 1px;
	text-decoration: none;
	outline:none;
	color: #000;
	background: #e4e4e4;
}
.notchedListItems a b {
	display: block;
	position:relative;
	top: -1px;
	left: 0;
	border:solid #666;
	border-width:1px 0 0;
	font-weight:normal;
}
.notchedListItems a b b {
  border-width:0 0 1px;
  top: 2px;
  padding:1px 6px;
}
.notchedListItems a:hover,
.notchedListItems a:hover b {background:#666;color:white;}
.feature {
	border:solid #647aae;
 	border-width:0 1px;
	background:#b0c0e6;
}
.feature div {
  position:relative;
  top: -1px;
  left: 0;
  border:solid #647aae;
  border-width:1px 0 0;
}
.feature div div {
	top: 2px;
	border-width:0 0 1px;
	padding: .3em .3em .1em;
}
</style>
</head>
<body>
<div class="examplesGoHere letsGiveItAFixedWidthOf200Pixels">
	<h3>A list</h3>
	<ul class="notchedListItems">
		<li><a href="#"><b><b>About</b></b></a></li>
		<li><a href="#"><b><b>Contact</b></b></a></li>
		<li><a href="#"><b><b>Cssrain</b></b></a></li>
	</ul>

<h3>A div</h3>
	<div class="feature">
		<div>
			<div>
				<p>This is an example of the notched corners as applied to a div container.</p>
				<p>This is an example of the notched corners as applied to a div container.</p>
				<p>This is an example of the notched corners as applied to a div container.</p>
			</div>
		</div>
	</div>
</div>
</body>
</html>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

[本日志由 admin 于 2010-09-01 10:05 AM 编辑]

文章来自: 本站原创

引用通告: 查看所有引用 | 我要引用此文章

Tags: css

相关日志:

评论: 0 | 引用: 0 | 查看次数: 1071

发表评论

昵　称:
密　码:	游客发言不需要密码.
内　容:	正在加载编辑器...
验证码:
选　项:	禁止表情转换禁止自动转换链接禁止自动转换关键字记住我的信息,以便下次评论时不用输入用户名.

虽然发表评论不用注册，但是为了保护您的发言权，建议您注册帐号. 字数限制 200 字 \| UBB代码关闭 \| [img]标签关闭

googleanalytics上用CSS控制的1像素圆角样式

作者:admin 日期:2008-12-21

Category

Calendar

Archive

Recent Comments

User Panel