Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Восстановить из v. 1
HTML
<style>
.metro-web-deva { width:100%680px; }   
.metro-web-deva .case {  float: left;  position: relative;  margin: 4px;  padding: 3px;  width: 150px;  height: 80px;  text-decoration: none;  cursor: pointer;  overflow: hidden;  color: #fff;  z-index: 9;  Background:#04aeda;  transition: all 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0s;  }   
 .metro-web-deva .case:hover {  opacity: 0.8;  filter: alpha(opacity=80);  }   
 .metro-web-deva .case span {  position: absolute;  left: 5px;  bottom: 5px;  font-size: 13px;  z-index: 8;  }  .metro-web-deva .case img.label {  position: absolute;  left: 50%;  top: 50%;  margin-left: -32px;  margin-top: -32px;  z-index: 7;  }   
.metro-web-deva .case img.large {  margin-left: 20px;  margin-top: 5px;  }
</style>
HTML
<div class="metro-web-deva">   
<a class="case" href="#" style="height: 174px;">  
 
 <span>Главная</span>  <img class="label" src="images/Windows-Metro.png" />  </a>   <a class="case" href="#" style="background: #fd9f13;">  <span>RSS</span>  <img class="label" src="images/Rss-Feed-Metro.png" alt="" />  </a>   <a class="case" href="#" style="width:314px;height: 80px; background: #4F4F4F;">  <span>Автор</span>  <img class="large" src="images/web-deva1.png" />  </a>   <a class="case" href="#" style="background: #c8312b;">  <span>YouTube</span>  <img class="label" src="images/Youtube-Red-Metro.png" alt="" />  </a>   <a class="case" href="#">  <span>Музыка</span>  <img class="label" src="images/Music-Folder-Metro.png" />  </a>   <a class="case" href="#" style="background: #19bfe5;">  <span>Twitter</span>  <img class="label" src="images/Twitter-Bird-Metro.png" alt="" />  </a>   <a class="case" href="#" style="background: #d64136;">  <span>Google+</span>  <img class="label" src="images/Google-Metro.png" alt="" />  </a>   <a class="case" href="#" style="background: #8b0189;">  <span>Видео</span>  <img class="label" src="images/Videos-Folder-Metro.png" />  </a>   <a class="case" href="#" style="background: #8b0189;">  <span>Видео</span>  <img class="label" src="images/Videos-Folder-Metro.png" />  </a>   <a class="case" href="#" style="background: #8b0189;">  <span>Видео</span>  <img class="label" src="images/Videos-Folder-Metro.png" />  </a>   </div>