کد های وبمستر

دانلود رایگان فوتر زیبا برای سایت و وبلاگ

همانطور که می دانید، فوتر یکی از اجزای اصلی وب سایت محسوب می شود به همین دلیل برای شما عزیزان یک فوتر آماده آماده کرده ام. می توانید از این کد در طراحی وب سایت خودتان استفاده نمایید و از رقیبان خود متفاوت باشید.

قسمت پایینی سایت که توضیحاتی در رابطه با حق نشر سایت ( کپی رایت )، شبکه های اجتماعی سایت، نوع طراحی سایت و… قرار میگیرد را فوتر footer مینامند که امروزه قرار دادن این بخش برای هر سایت لازم میباشد.

فوتر سایت این فوتر با استفاده از کد های HTML و CSS نوشته شده است و آیکون های شبکه های اجتماعی آن را میتوانید به سلیقه خودتان تغییر دهید یا حتی آیکون سایر شبکه های اجتماعی را به آن اضافه نمایید.

<!DOCTYPE html>
<html >
  <head>
    <meta charset="UTF-8">
    <title>فوتر زیبای سایت</title>
  </head>
  <body>
<div class="footer">
  <span class="name">وب سایت شخصی سیدرضا بازیار</span>
    <span class="social-media">
    <a href="https://www.facebook.com/SRBazyar" class="fa fa-facebook-square"></a>
    <a href="https://twitter.com/seyedrezabazyar" class="fa fa-twitter-square"></a>
    <a href="https://www.youtube.com/channel/UCgFgsVUAyt41bme2oLjeUag" class="fa fa-youtube-square"></a>
    <a href="https://www.linkedin.com/in/seyedrezabazyar" class="fa fa-linkedin-square"></a>
    <a href="https://www.instagram.com/bazyarseyedreza" class="fa fa-instagram"></a>
    <a href="http://vk.com/seyedrezabazyar" class="fa fa-vk"></a>
    <a href="https://plus.google.com/104455170556222389049" class="fa fa-google-plus"></a>

  </span>  
  <span class="copyright">Copyright © 2016, All Rights Reserved</span>
    <span class="quick-access">
      <a>Design By:</a> <a href="https://www.seyedrezabazyar.com">Seyed Reza Bazyar</a>
  </span>  
</div>  
  </body>
</html>
@import url("http://fonts.googleapis.com/css?family=Cookie");
@import url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css");

* { margin: 0; padding: 0; box-sizing: border-box; }

.footer {
  display: block;
  width: 100%;
  padding: 10px;
  text-align: center;  
  background-color: black;
  background-image: url("https://www.seyedrezabazyar.com/codetools/files/Elegant-Black.jpg");
  background-size: contain;
  background-position: top center;
  background-repeat: repeat;  
}

.footer > span {
  display: block;
  color: #dddddd;
  font-family: sans-serif;
}

.footer > span > a {
  color: steelblue;
  text-decoration: none;
}

.footer > .name {
  margin-top: 30px;
  margin-bottom: 10px;
  font-size: 200%;
  font-family: cookie;
}

.footer > .social-media { margin-bottom: 10px; }
.footer > .social-media > a {
  padding: 0 5px;
  font-size: 38px;
}

.footer > .copyright { font-size: 60%; }

.footer > .quick-access > a {
  border-right: 1px solid steelblue;
  padding: 0 1em;
  font-size: 60%;
}
.footer > .quick-access > a:last-child { border: 0; }

مشاهده دمو آنلاین

سیدرضا بازیار

به وب سایت شخصی من خوش آمدید! من سیدرضا بازیار هستم، متولد 1374 شهرستان کازرون. در حال حاضر مهندس فناوری اطلاعات هستم، مسلط به زبان های: HTML - CSS - JavaScript - PHP و در حال یادگیری زبان Python هستم و علاقه بسیار زیادی به برنامه نویسی تحت وب ، هوش مصنوعی و زمینه امنیت اطلاعات دارم.

‫6 نظرها

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *