Praneškite apie mus:


CSS nuorodos

0

Kiekviename puslapyje yra nemažai nuorodų. Nuorodos turi būti kitokios išvaizdos nei paprastas tekstas, tada vartotojui bus paprasta suprasti, kad tai yra nuoroda ir ant jos galima paspausti. Kuriant nuorodas yra naudojami įvairūs hover efektai, t.y. efektas užvedus pelės žymeklį ant nuorodos. Žemiau pateikiu lentelę su keliomis stilių taisyklėmis, kurios keičia nuorodų stilius.



 

Reikšmių lentelė

Parametras Reikšmė
text-align
Nurodo teksto horizontalų lygiavimą
text-decoration
Nurodo papildomas nuorodos dekoracijas
text-transform
Nurodo papildomas nuorodos transormacijas
line-height
Nurodo nuorodos teksto eilutės aukštį
color
Nurodo nuorodos teksto spalvą
direction
Nurodo nuorodos teksto kryptį
letter-spacing
Nurodo nuorodos tarpų tarp raidžių plotį
word-spacing
Nurodo tarpų tarp žodžių dydžius
border Nurodo rėmelį aplink nuorodą
margin Nurodo erdvę aplink nuorodos rėmelį
padding Nurodo erdvę tarp nuorodos teksto ir rėmelio
outline Nurodo erdvę tarp border ir margin

 

Pseudo klasės

Su nuorodomis yra naudojamos jų stilių pseudo klasės:

  • a:link - paprasta nuoroda, dar ant jos nebuvo paspausta
  • a:visited - nuoroda, kurioje vartotojas jau buvo
  • a:hover - nuoroda ant kurios vartotojas užėjo su pele
  • a:active - dabar aktyvi nuoroda

Jei norit, kad nuorodų pseudo klasės gerai veiktų, ja aprašyti reikia būtent šia tvarka: a:link, a:visited, a:hover, a:active. Kitu atveju gali kilti netikslumų.

 

Pavyzdys

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<style type="text/css">
a:link, a:active, a:visited {
padding:10px;
line-height:25px;
font-size:15px;
font-weight:bold;
background-color:#0CC;
text-decoration:none;
font-family:Verdana, Geneva, sans-serif;
}
a:hover {
background-color:#0F6;
font-style:italic;
text-decoration:overline underline;
}
</style>
 
<a href="#">Pradžia</a>
<a href="#">Antras</a>
<a href="#">Trečias</a>
 

 

 

pabandyk_pats

 

Taip pat patariu pažiūrėti šiuos straipsnius

CSS rėmai ir kontūrai - width, height, padding, border, outline, margin ir overflow

CSS šriftai

CSS teksto nustatymai

CSS fonas

Perskaityta: 3273 kartų

Lukas
Autorius: Lukas
El. paštas.: Šis el. pašto adresas yra apsaugotas nuo spam botų. Jum reikalingas įjungtas Javasctipt kad jį matytumėte
Manualai.lt tinklo autorius ir administratorius. VDU Energetikos Fizikos ir Verslo Informatikos studentas. LinkedIn
Raktažodžiai
stiliai    pradmenys    css    klasės    nuorodos    pseudo    links   
Patinka straipsnis?
Komentarai

Komentarų nėra. Norėdami komentuoti turite prisijungti