<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style>
.example-date {
background-color: #987;
float: right;
position: relative;
padding: 45px 5px 0px;
margin-left: 10px;
}
.example-date .month {
text-transform: uppercase;
font-size: 25px;
}
.example-date .day {
font-size: 40px;
line-height: 45px;
position: absolute;
left: 5px;
top: 0px;
}
.example-date .year {
display: block;
position: absolute;
right:-8px;
*right: -5px;
top: 12px;
*top:15px;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
}
</style>
<!--[if IE]>
<style>
.example-date .year {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
right:0;
top:5px;
}
</style>
<![endif]-->
</head>
<body>
<body>
<div class="example-date">
<span class="day">07</span>
<span class="month">八月</span>
<span class="year">2009</span>
</div>
</body>
</html>
posted on 2009-09-24 18:23
汪杰 阅读(206)
评论(0) 编辑 收藏 引用 所属分类:
divandcss