asculta virgin radio

Distribuiţi | 

Meniul forumului folosind imagini

 Scris de Lcnn la data de Lun Noi 23, 2015 6:55 am

Salutare dragi prieteni astazi o sa va arat cum putem transforma un simplu meniu intr-unul foarte frumos folosind imaginile.
Demonstratie Live: [Trebuie sa fiti inscris si conectat pentru a vedea acest link]

Imaginile meniului:
[Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine][Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]

Pasul 1:
Intram in Panou de administrare/Afisare/Antet si navigare si selectam:
[Trebuie sa fiti inscris si conectat pentru a vedea acest link]
Apoi apasati tasta [Trebuie sa fiti inscris si conectat pentru a vedea acest link]

Pasul 2:
Panou de administrare/afisare/culori/css si adaugam acest cod.

Cod:

a.mainmenu img{
  height: 34px!important;
  float: left;
    border: 1px solid #a5a5a5;
  border-bottom: none;
  margin-right: -1px;
}
img#i_icon_mini_index{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/forum10.png)!important;
  background-repeat: no-repeat;
  width: 80px;
  border-radius: 3px 0px 0px 3px;
}

img#i_icon_mini_index:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/forum10.png)!important;
  background-position: 0px -36px;
}


img#i_icon_mini_calendar{

  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/calend11.png)!important;
  background-repeat: no-repeat;
  width: 80px;

}

img#i_icon_mini_calendar:hover{
  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/calend11.png)!important;
  background-position: 0px -36px;
}

img#i_icon_mini_galery{

  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/galeri10.png)!important;
  background-repeat: no-repeat;
  width: 80px;

}

img#i_icon_mini_galery:hover{
  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/galeri10.png)!important;
  background-position: 0px -36px;
}


img#i_icon_mini_faq{

  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/faq10.png)!important;
  background-repeat: no-repeat;
  width: 60px;
  background-position: -10px 0px;

}

img#i_icon_mini_faq:hover{
  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/faq10.png)!important;
  background-position: -10px -36px!important;
}

img#i_icon_mini_search{

  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/cautar10.png)!important;
  background-repeat: no-repeat;
  width: 80px;


}

img#i_icon_mini_search:hover{
  background-image: url(http://i68.servimg.com/u/f68/14/12/03/12/cautar10.png)!important;
  background-position: 0px -36px!important;
}


img#i_icon_mini_members{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/membri10.png)!important;
  background-repeat: no-repeat;
  width: 80px;


}

img#i_icon_mini_members:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/membri10.png)!important;
  background-position: 0px -36px!important;
}

img#i_icon_mini_groups{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/grupur10.png)!important;
  background-repeat: no-repeat;
  width: 80px;


}

img#i_icon_mini_groups:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/grupur10.png)!important;
  background-position: 0px -36px!important;
}



img#i_icon_mini_profile{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/profil10.png)!important;
  background-repeat: no-repeat;
  width: 80px;


}

img#i_icon_mini_profile:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/profil10.png)!important;
  background-position: 0px -36px!important;
}

img#i_icon_mini_message{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/mesage10.png)!important;
  background-repeat: no-repeat;
  width: 80px;


}

img#i_icon_mini_message:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/mesage10.png)!important;
  background-position: 0px -36px!important;
}



img#i_icon_mini_new_message_new{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/mesajn10.png)!important;
  background-repeat: no-repeat;
  width: 80px;


}

img#i_icon_mini_new_message:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/mesajn10.png)!important;
  background-position: 0px -36px!important;
}


img#i_icon_mini_login{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/conect10.png)!important;
  background-repeat: no-repeat;
  width: 80px;

  border-radius: 0px 5px 5px 0px;
}

img#i_icon_mini_login:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/conect10.png)!important;
  background-position: 0px -36px!important;
}


img#i_icon_mini_logout{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/decone12.png)!important;
  background-repeat: no-repeat;
  width: 100px;
  border-radius: 0px 5px 5px 0px;
}

img#i_icon_mini_logout:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/decone12.png)!important;
  background-position: 0px -36px!important;

}

img#i_icon_mini_register{

  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/inregi10.png)!important;
  background-repeat: no-repeat;
  width: 100px;


}

img#i_icon_mini_register:hover{
  background-image: url(http://i68.servimg.com/u/f68/19/36/53/46/inregi10.png)!important;
  background-position: 0px -36px!important;
}

Apoi apasati tasta [Trebuie sa fiti inscris si conectat pentru a vedea acest link]


Ultima editare efectuata de catre pHpDeviL in Lun Noi 23, 2015 11:55 am, editata de 1 ori
Offline
avatar
Lcnn
Administrator

Mesaje : 321
Varsta : 25
Localizare : Timisoara

Vezi profilul utilizatorului http://phpbb2.phpdevil.com

Re: Meniul forumului folosind imagini

 Scris de First Time la data de Lun Noi 23, 2015 9:37 am

Arata excelent, dar la butonul deconectare cand tin cursorul pe el nu apare imaginea.
Offline
avatar
First Time
Moderator

Mesaje : 32

Vezi profilul utilizatorului

Re: Meniul forumului folosind imagini

 Scris de Lcnn la data de Lun Noi 23, 2015 12:02 pm

Multumesc pentru atentonare,gresisem si clasa,si imaginea!
Offline
avatar
Lcnn
Administrator

Mesaje : 321
Varsta : 25
Localizare : Timisoara

Vezi profilul utilizatorului http://phpbb2.phpdevil.com

Re: Meniul forumului folosind imagini

 Scris de Continut sponsorizat

Offline

Continut sponsorizat


Pagina 1 din 1

Permisiunile acestui forum:Nu puteti raspunde la subiectele acestui forum
phpbb2.phpdevil.com :: PHPDEVIL # Web-design :: Tutoriale-
Mergi direct la:  

pHpDeviL | For the love of the game...