> 代码 > 文字特效CSS打造旋转文字
作者:vip_260 来源:未知 日期:2010/1/26 16:08:41 人气:
标签:
演示效果截图CSS代码<style type="text/css"> a { color:#000; } .example-date { background-color:#998877; float:left; margin-left:10px; padding:45px 5px 0; position:relative; } .example-date .day { font-size:45px; left:5px; line-height:45px; position:absolute; top:0; } .example-date .month { font-size:25px; text-transform:uppercase; } .example-date .year { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); display:block; font-size:1.1em; background-color:#998877; position:absolute; right:0px; top:10px; } </style> HTML代码<h3>使用CSS旋转文本元素</h3> <div class="example-date"> <span class="day">31</span> <span class="month">July</span> <span class="year">2009</span> </div> <h3><a href="http://www.v404.cn">www.v404.cn</a></h3> |
|