Pseudoklasy odsyłaczy Łączenie pseudoklasy z klasą
Transkrypt
Pseudoklasy odsyłaczy Łączenie pseudoklasy z klasą
11. Pseudoklasy, pseudoelementy Pseudoklasy odsyłaczy Pseudoklasa Opis Przykład a:link wygląd hiperłącza a:link { color: RGB(42,204,73); } a:hover wygląd hiperłącza po wskazaniu myszą a:hover { color: RGB(255,17,17); } a:active wygląd hiperłącza po wskazaniu myszą i przyciśnięciu przycisku myszy (ale przed zwolnieniem tego klawisza) a:active { color: RGB(255,255,0); } a:visited wygląd hiperłącza po odwiedzeniu strony a:visited { color: RGB(108,91,155); text-decoration: none; } Łączenie pseudoklasy z klasą przykład <html> <head> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <a class="zielony" href="http://www.google.pl">http://www.google.pl</a><br> <a class="czerwony" href="http://www.google.pl">http://www.google.pl</a> </body> </html> Zawartość pliku o nazwie style.css a.zielony:link { color: green; } a.czerwony:link { color: red; } a.czerwony:hover { text-decoration: none; } wynik w przeglądarce internetowej opracował: Aleksander Piętowski 1/3 11. Pseudoklasy, pseudoelementy Pseudoelementy Pseudoelement Opis Przykład :first-letter wyróżnia pierwszą literę bloku tekstu p:first-letter { font-size: 25pt; } :first-line wyróżnia pierwszą linię bloku tekstu p:first-line { font-size: 15pt; } przykład 1 <html> <head> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <p>Dawno, dawno temu ...</p> </body> </html> Zawartość pliku o nazwie style.css p:first-letter { font-size: 25pt; } wynik w przeglądarce internetowej opracował: Aleksander Piętowski 2/3 11. Pseudoklasy, pseudoelementy przykład 2 <html> <head> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <p> Informatyka jest obszerną i podstawową dziedziną o zasadniczym znaczeniu dla społeczeństwa w dobie rewolucji informacyjnej. Jej głównym celem jest badanie praw i ich zasięgu, praw rządzących procesami informacyjnymi i ich realizacjami. Dodatkowym celem informatyki jest opracowywanie nowych i skutecznych narzędzi intelektualnych, niezbędnych do rozwiązywania problemów przetwarzania informacji we wszystkich dziedzinach aktywności ludzkiej. Informatyka już teraz ma znaczący wpływ na rozwój innych nauk, na przemysł i nowoczesną technologię, na rolnictwo, ekonomię, kształcenie, a także na poszerzanie granic pojmowania wszechświata. </p> </body> </html> Zawartość pliku o nazwie style.css p:first-line { font-size: 15pt; } wynik w przeglądarce internetowej opracował: Aleksander Piętowski 3/3