HOŞ GELDİNİZ!

Adanalı · 1 Ocak 2019

Yaptığım bir indexte eklemiş olduğum güzel bir dj isim listesi tablosu. Tabloya Dj avatarı, yayın bilgileri, yayın saati gibi özellikleri ekleyebilirsiniz. Renk kodlarını kullanarak istediğiniz rengi kullanabilirsiniz.

Tablo canlı demosu => Radyo Yayın Ekibi | xxx FM

Ekran görüntüsü:

Sitenize eklemeniz gereken kodlar:

HTML:

<style>
body {font-family: tahoma;font-size: 15px;}
.yayinci-listesi {
    background: #191919;
    padding: 3px 0px;
}

.yayinci-listesi ul {
    position: relative;
    margin-top: -15px;
    left: -1.5px;
    display: block;
    list-style: none;
}

.yayinci-listesi ul li {
    display: inline-block;
    margin-left: 5px;
    margin-top: 15px;
    width: 240px;
}
td img {
    width: 100%;
    height: 220px;
    border: dashed 1px #999;
    position: relative;
    left: -1px;
}
td {
    background: #191919;
    border: 1px dashed #999;
    padding: 5px;
    text-align: center;
}
</style>

<div class="yayinci-listesi">
<ul>
<!--Liste 1-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#ff0000;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#ff0000;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#ff0000;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#ff0000;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 2-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#00ff21;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#00ff21;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#00ff21;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#00ff21;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 3-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#00ffd4;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#00ffd4;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#00ffd4;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#00ffd4;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 4-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#ffd400;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#ffd400;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#ffd400;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#ffd400;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 5-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#00cbff;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#00cbff;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#00cbff;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#00cbff;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 6-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#e332ff;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#e332ff;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#e332ff;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#e332ff;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 7-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#31a9ff;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#31a9ff;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#31a9ff;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#31a9ff;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 8-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#ff0000;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#ff0000;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#ff0000;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#ff0000;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 9-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#ff0000;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#ff0000;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#ff0000;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#ff0000;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 10-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#ff0000;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#ff0000;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#ff0000;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#ff0000;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 11-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#ff0000;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#ff0000;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#ff0000;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#ff0000;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>

<!--Liste 12-->
<li>
<table width="240" border="0" cellspacing="5" cellpadding="5">
  <tr>
    <td><img src="http://demo.webadam.net/muzik-zamani-radyo-index/images/12.jpg"></td>
  </tr>
  <tr>
    <td><span class="style3">Yayıncı :</span> <span style="color:#ff0000;">Dj Adı</span></td>   
  </tr>
  <tr>
    <td><span class="style3">Tarzı :</span> <span style="color:#ff0000;">Karışık</font></font></td>
  </tr>
  <tr>
    <td><span class="style3">Nerden :</span> <span style="color:#ff0000;">ADANA</font></td>
  </tr>
  <tr>
    <td><span class="style3">Görevi :</span> <span style="color:#ff0000;">RADYO KURUCU</font></td>
  </tr>
</table>
</li>
</ul>
</div>

Not: Kodlar eklediğiniz sayfanın css yapılandırmasına göre değişiklik gösterebilir, kodlarla oynayarak istediğiniz düzenlemeyi yapabilirsiniz. Eğer yapamazsanız konu altından yardım isteyebilirsiniz.

Sabotaj · 2 Ağustos 2020

emeginize saglik paylasima tesekkurler

HOŞ GELDİNİZ!

Burayı Görünüm ve Diller altında bulunan Tema özellikleri > [-MD-] Ziyaretçi Paneli alanından düzenleyebilirsiniz.

Html & Css dj isim listesi tablosu

Adanalı

Sabotaj

Konuyu toplam 0 üye okuyor. (0 Kayıtlı üye ve 0 Misafir)

Forum istatistikleri

Trend içerik

En yeni üyeler