Izmenite izgled AjaxControlToolkit TabContainer kontrole

Vrlo je jednostavno izmeniti izgled TabContainer ASP.NET Ajax kontrole koja dolazi u okviru AjaxControlToolkit-a. Potrebno je samo podesiti nekoliko CSS svojstava. Ispod se nalazi opis glavnih CSS klasa preko kojih možete da menjate izgled kontrole.

  • .ajax__tab_header: Element koji služi kao kontejner za sve tab hedere.
  • .ajax__tab_outer: Spoljni (outer) element pojedinačnog taba, najčešće se koristi za definisanje leve strane pozadine taba.
  • .ajax__tab_inner: Unutrašnji (inner) element pojedinačnog taba, koji se koristi za definisanje desne strane pozadine taba.
  • .ajax__tab_tab: Element taba koji sadrži tekst.
  • .ajax__tab_body: Element koji služi kao kontejner za TabPanele svakog taba.
  • .ajax__tab_panel: Kontejner u kome je smešten sadržaj svakog taba.
  • .ajax__tab_hover: Određuje izgled taba kada se miš nalazi iznad njega (hover).
  • .ajax__tab_active: Određuje izgled trenutno izabaranog taba.
Da bi ovo bilo još razumljivije, napravio sam i grafički prikaz klasa. Plavim je uokviren sadržaj svake klase.


Kompletnu dokumentaciju o ovoj kontroli pogledajte na ASP.NET Ajax oficijalnom sajtu.

Ukoliko vas mrzi da sami ovo radite ili niste skloni dizajnu i CSS-u, pogledajte fenomenalan post Matt Berseth-a pod nazivom More Sample AjaxControlToolkit TabContainer Themes.Tu ćete naći pet odličnih predloga za teme koje možete i da preuzmete.

Published Friday, January 4, 2008 7:39 PM by janko
Filed under: , , ,
Powered by Community Server (Commercial Edition), by Telligent Systems