Blinking text CSS

Works on Firefox, Chrome, IE latest versions.

Check this link

.blink_me {
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;

    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;

    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@-moz-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@-webkit-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

Web Trends for 2013

10 Web Design Trends

20 Hottest Trends

20 top web design and development trends

CSS Dropdown Menu

 #cssdropdown, #cssdropdown ul { list-style: none; }
 
 #cssdropdown, #cssdropdown * { padding: 0; margin: 0; list-style: none; }
 
 #cssdropdown li.headlink {
  width: 165px;
  float: left;
  margin-left: -1px;
  border: 1px black solid;
  text-align: center;
 }
 #cssdropdown li.headlink a { display: block; padding:0; text-decoration: none; }

 #cssdropdown li.headlink ul { display: none; border-top: 1px black solid; text-align: left; }
 #cssdropdown li.headlink:hover ul { display: block; }
 #cssdropdown li.headlink ul li a { padding: 0; height: 17px; }
 #cssdropdown li.headlink ul li a:hover { background-color: #333; }
 
 
 #cssdropdown a { color: white; } #cssdropdown ul li a:hover { text-decoration: none; }
 #cssdropdown li.headlink {
  background-color:#262626;
 }
 #cssdropdown li.headlink:hover {
 
 background-color:#333;
 }
 #cssdropdown li.headlink ul {
  background-color:#262626;
 }
 
 #cssdropdown li.headlink a {
  font-size:16px; 
  font-weight:bold;
  line-height:44px;
 }
 
 #cssdropdown li.headlink ul li a {
  font-size:12px; 
  font-weight:normal;
  border-top:solid 1px #000000;
  line-height:30px;
  height:30px;
  padding-left:5px;
  text-align:left;
 }
 
 #cssdropdown li.headlink ul li a.first {
  margin-top:-1px;
 }
 
 #cssdropdown {
  position:absolute; top:0; left:0;
 }
 
 
 $(document).ready(function(){
  $('#cssdropdown li.headlink').hover(
   function() { $('ul', this).css('display', 'block'); },
   function() { $('ul', this).css('display', 'none');
  });
 });
 
<table width="1000" border="1" cellpadding="0" cellspacing="0">
 <tr>
  <td><div style="position:relative;">
    <ul id="cssdropdown">
     <li class="headlink"> <a href="#">Home</a> </li>
     <li class="headlink"><a href="#">Archive 2008</a>
      <ul>
       <li><a href="#" class="first">Archive 2008</a></li>
       <li><a href="#">Archive 2009</a></li>
       <li><a href="#">Archive 2010</a></li>
       <li><a href="#">Archive 2011</a></li>
       <li><a href="#">Posts Atom</a></li>
      </ul>
     </li>
     <li class="headlink"><a href="#">Archive 2009</a></li>
     <li class="headlink"><a href="#">Archive 2010</a></li>
     <li class="headlink"><a href="#">Archive 2011</a></li>
     <li class="headlink"><a href="#">Posts Atom</a></li>
    </ul>
   </div></td>
 </tr>
 <tr>
  <td height="100" bgcolor="#FFFFFF">Content</td>
 </tr>
</table>

CSS Button Generator

Nice CSS3 Button Generator

Click Here

CSS Gradient

 .orangeGradientVertical {
      background: #FFE27C; /* Old browsers */
      background: -moz-linear-gradient(top, #FFE27C 0%, #ffd83b 100%); /* FF3.6+ */
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFE27C), color-stop(100%,#ffd83b)); /* Chrome,Safari4+ */
      background: -webkit-linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* Chrome10+,Safari5.1+ */
      background: -o-linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* Opera11.10+ */
      background: -ms-linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* IE10+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFE27C', endColorstr='#ffd83b',GradientType=0 ); /* IE6-9 */
      background: linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* W3C */
    }

Box-Shadow in CSS3

#example1 {
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;
}