WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS   Ingyenes elektronikus tananyag interaktív
weboldalak készítéséhez.
Custom Search
 
vissza VISSZA    
menü MENÜ    
ismét ISMÉT    
tovább TOVÁBB    

Dinamikus álosztály kijelölők



:hover álosztály


Álosztály: Kijelöli azt az elemet, amely fölött egérkurzor áll.

:hover
{
meghatározásblokk
}
/*Az egérkurzor fölötte áll.*/


:active álosztály


Álosztály: Kijelöli azt az elemet, amely fölött egérkurzor áll, és a felhasználó megnyomta a bal egér gombot.

:active
{
meghatározásblokk
}
/*Most kattintunk rá, de az egérgomb még nincs felengedve.*/


:focus álosztály


Álosztály: Kijelöli azt az elemet, amely éppen a billentyűzetről érkező adatokat fogadja.

:focus
{
meghatározásblokk
}
/*Ez az elem fogadja a billentyűzettel bevitt adatokat.*/


Példa:

Forráskód



<style>
    a:hover { background-color:yellow; } /* Az egérkurzor fölötte áll.*/ 
    a:active { background-color:red; } 
       /* Most kattintunk rá, de az egérgomb még nincs felengedve.*/ 
    input:focus { background-color:yellow; }
       /*Ez az elem fogadja a billentyűzettel bevitt adatokat.*/
</style>     
...
<body>      
     Link  1:  <a href="http://www.google.hu/" target="_blank">Google</a>  <br>
     Link  2:  <a href="http://www.yahoo.com/" target="_blank">Yahoo</a>  <br>
     Input 1: <input type="text" > <br>
     Input 2: <input type="text" autofocus>  
</body>
 

Eredmény*


* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_kijelolo_dinamikus_aloszt.html