<p class="sycode"> <br> </p> <br> <title>CSS3 实现RSS图标</title> <br> <style type="text/css"> <br /> body{ <br /> padding:50px 0 0 0 <br /> } <br /> span.feed-box{ <br /> display:block; <br /> width:100px; <br /> height:100px; <br /> margin:0 auto; <br /> background:#F9A004; <br /> box-shadow: <br /> 1px 1px 0 #C27C03, <br /> 2px 2px 0 #C27C03, <br /> 3px 3px 0 #C27C03; <br /> -moz-box-shadow: <br /> 1px 1px 0 #C27C03, <br /> 2px 2px 0 #C27C03, <br /> 3px 3px 0 #C27C03; <br /> -webkit-box-shadow: <br /> 1px 1px 0 #C27C03, <br /> 2px 2px 0 #C27C03, <br /> 3px 3px 0 #C27C03; <br /> -moz-border-radius:10px; <br /> -webkit-border-radius:10px; <br /> border-radius:10px <br /> } <br /> span.feed-box *{ <br /> float:right; <br /> display:block <br /> } <br /> span.feed-box .feed-box-in{ <br /> border:2px solid #FFC563; <br /> width:92px; <br /> height:92px; <br /> margin:2px 2px 0 0; <br /> -moz-border-radius:10px; <br /> -webkit-border-radius:10px; <br /> border-radius:10px; <br /> overflow:hidden <br /> } <br /> span.feed-box .feed-box-in .feed-quarter-circle-big{ <br /> margin:8px 8px 0 0; <br /> width:130px; <br /> height:130px; <br /> border:13px solid #FFDEA5; <br /> border-radius:50% <br /> } <br /> span.feed-box .feed-box-in .feed-quarter-circle-big .feed-quarter-circle-small{ <br /> margin:9px 9px 0 0; <br /> width:88px; <br /> height:88px; <br /> border:12px solid #FFDEA5; <br /> border-radius:50% <br /> } <br /> span.feed-box .feed-box-in .feed-quarter-circle-big .feed-quarter-circle-small .feed-circle{ <br /> margin:13px 13px 0 0; <br /> background:#FFDEA5; <br /> width:35px; <br /> height:35px; <br /> border-radius:50% <br /> } <br /> span.feed-box:hover{ <br /> background:#07C103; <br /> box-shadow: <br /> 1px 1px 0 #058E02, <br /> 2px 2px 0 #058E02, <br /> 3px 3px 0 #058E02; <br /> -moz-box-shadow: <br /> 1px 1px 0 #058E02, <br /> 2px 2px 0 #058E02, <br /> 3px 3px 0 #058E02; <br /> -webkit-box-shadow: <br /> 1px 1px 0 #058E02, <br /> 2px 2px 0 #058E02, <br /> 3px 3px 0 #058E02 <br /> } <br /> span.feed-box:hover .feed-box-in{ <br /> border-color:#58FC55 <br /> } <br /> span.feed-box:hover .feed-box-in .feed-quarter-circle-big, <br /> span.feed-box:hover .feed-box-in .feed-quarter-circle-big .feed-quarter-circle-small{ <br /> border-color:#B9FFB7 <br /> } <br /> span.feed-box:hover .feed-box-in .feed-quarter-circle-big .feed-quarter-circle-small .feed-circle{ <br /> background:#B9FFB7 <br /> } <br /> </style> <br> <br> <br> <span class="feed-box"> <br> <span class="feed-box-in"> <br> <span class="feed-quarter-circle-big"> <br> <span class="feed-quarter-circle-small"> <br> <span class="feed-circle"> </span><!-- #circle --> <br> </span><!-- #feed-quarter-circle-small --> <br> </span><!-- #feed-quarter-circle-big --> <br> </span><!-- #feed-box-in --> <br> </span><!-- #feed-box --> <br> <div><a href="http://www.999jiujiu.com/"> http://www.999jiujiu.com/</a></div> <br> <br>
