fraNNNta-Design

Bine a-ti venit pe fraNNNta-Design
conectarecreaza cont



Punbb:Staff List

Distribuiţi
mihai OnlineOffline
avatar
Rank: Membru
Respect : 75%
Mesaje : 537
Inscris : 21/02/2016

biggri Punbb:Staff List

Mesaj Scris de mihai la data de Mier Noi 07, 2018 12:13 am

Bun găsit,

în acest tutorial vă voi învăța cum să faceți un staff list, mai exact gata făcut .

PDA > Diverse >   HTML & JAVASCRIPT > Administrare pagini HTML > Creare in Mod Avansat (HTML)

Previzualizare instalare:


Cod:
Cod:
<h3 class="maintitle">Staff List</h3>
<table class="ipb_table ipsMemberList">
 <tbody><tr class="header">
 <th scope="col" style="width: 3%"> </th>
 <th scope="col" style="width: 20%">Name</th>
 <th scope="col" style="width: 25%">Function</th>
 <th scope="col" style="width: 25%" class="short">Location</th>
                <th scope="col" style="width: 25%" class="short">Contact</th>
 <th scope="col" style="width: 12%">&nbsp;</th>
 </tr>
 
 
<tr class="row1">

<td><div class="left">
<img src="" class="avt-rr">
</div>
</td>

<td>
  <span style="color:#cod culoare;font-weight:bold;">-</span>
</td>

<td>
<span style="color:#cod culoare;font-weight:bold;"></span>
</td>

</tr>
 


 

<tr class="row2">

<td><div class="left">
<img src="" class="avt-rr">
</div>
</td>

<td>
  <span style="color:#cod culoare;font-weight:bold;">-</span>
</td>

<td>
<span style="color:#cod culoare;font-weight:bold;"></span>
</td>

</tr>
 
 



<tr class="row1">

<td><div class="left">
<img src="" class="avt-rr">
</div>
</td>

<td>
  <span style="color:#cod culoare;font-weight:bold;">-</span>
</td>

<td>
<span style="color:#cod culoare;font-weight:bold;"></span>
</td>

</tr>
 


<tr class="row2">

<td><div class="left">
<img src="" class="avt-rr">
</div>
</td>

<td>
  <span style="color:#cod culoare;font-weight:bold;">-</span>
</td>

<td>
<span style="color:#cod culoare;font-weight:bold;"></span>
</td>

</tr>
</tbody></table>

CSS:
Cod:
.avt-rr {
    width: 30px;
    height: 30px;
    margin: 3px;
    padding: 1px;
    border: 1px solid #D5D5D5;
    background: white;
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}
table.ipb_table td {
    padding: 10px;
    border-bottom: 1px solid #f3f3f3;
}
table.ipb_table {
    width: 100%;
    line-height: 1.3;
    border-collapse: collapse;
}
.header {
    background: #b6c7db;
    color: #1d3652;
}
table.ipb_table th {
    font-size: 11px;
    font-weight: bold;
    padding: 8px 6px;
}

După instalarea codului, ar trebui să avem așa ceva:

Notă: va trebuie să adăugați fiecare avatar, nume, funcție, locație, și așa mai departe.

Dacă sunt probleme, vă rugăm să folosiți secț. corespunzătoare!

Tutorial realizat de Mark.


Sus
Vezi profilul utilizatorului Vizualizeaza profilul
mr.franta OnlineOffline
avatar
fondator
Respect : 100%
Mesaje : 3979
Inscris : 18/06/2011

biggri Re: Punbb:Staff List

Mesaj Scris de mr.franta la data de Mier Noi 07, 2018 9:51 pm

Nui cine stie ce,am facut mai reusite si frumoase,dar cine stie poate cuiva ii va place mai mult.


Sus
Vezi profilul utilizatorului Vizualizeaza profilul

    Acum este: Mar Noi 13, 2018 11:56 pm