Tá naisc an-choitianta ar leathanaigh ghréasáin, ach ní thuigeann go leor dearthóirí gréasáin an chumhacht atá acu le CSS chun a gcuid nasc a ionramháil agus a bhainistiú go héifeachtach. Is féidir leat naisc a shainiú leis na stáit atá ar cuairt, ag taisteal, agus sna gníomhartha. Is féidir leat oibriú freisin le teorainneacha agus le cúlraí chun níos mó pizzaz a thabhairt do naisc nó is cosúil gur mhaith cnaipí nó fiú íomhánna orthu.
Tosaíonn an chuid is mó de dhearthóirí gréasáin trí stíl a shainiú ar an gclib "a":
a {dath: dearg; }Déanfaidh sé seo gach gné den nasc a stíl (cluaisín, cuairt, agus gníomhach). Le stíl gach cuid ar leithligh, ní mór duit pseudo-ranganna nasc a úsáid.
Nasc Pseudo-Classes
Tá ceithre chineál bunúsach de fhiriúganna teagmhála ann ar féidir leat a shainmhíniú:
- : nasc - is é seo an stíl réamhshocraithe don nasc
- : thug cuairt air - tar éis nasc a bheith cliceáil
- : hover - de réir mar a luchtar luch thar nasc (réamh-cliceáil)
- : gníomhach - ceart mar atá an nasc á cliceáil
Chun nasc fírinneach a shainiú, bain úsáid as an chlib i do roghnóir CSS . Mar sin, chun dath na cuairte uile do naisc go léir a athrú go liath, scríobh:
a: cuairt {dath: liath; }Má stíl tú nasc amháin pseudo-rang, is smaoineamh maith é stíl a chur orthu go léir. Sa chaoi sin ní chuirfidh tú torthaí iontacha ort iontas ort. Mar sin, más mian leat ach an dath a bhfuil cuairt á dhéanamh agat a athrú go liath, agus go bhfanfaidh na hairíonna eile de do chuid naisc dubh, ba mhaith leat scríobh:
a: nasc, a: hover, a: active {dath: dubh; } a: cuairt {dath: liath; }Athraigh na Dathanna Nasc
Is é an bealach is coitianta chun naisc stíl ná an dath a athrú nuair a théann an luch os a chionn:
a {dath: # 00f; } a: hover {dath: # 0f0; }Ach ná déan dearmad gur féidir leat difear a dhéanamh ar conas a bhraitheann an nasc mar atá siad cliceáil ar sé leis an: maoin ghníomhach:
a {dath: # 00f; } a: gníomhach {dath: # f00; }Nó cén chaoi a bhreathnaíonn an nasc tar éis duit cuairt a thabhairt air: an mhaoin a thugtar cuairt air:
a {dath: # 00f; } a: cuairt {dath: # f0f; }Chun é a chur le chéile go léir:
a {dath: # 00f; } a: cuairt {dath: # f0f; } a: hover {dath: # 0f0; } a: gníomhach {dath: # f00; }Cuir Cúlraí ar na Naisc chun Dheilbhíní nó Urchair a Chur Leis
Is féidir leat cúlra a chur ar nasc mar atá san Airteagal Stylish Backgrounds, ach trí imirt beagán leis an gcúlra, is féidir leat nasc a chruthú a bhfuil deilbhín gaolmhar aige. Roghnaigh deilbhín atá beag, thart ar 15px faoi 15px, mura bhfuil do théacs níos mó. Cuir an cúlra ar thaobh amháin den nasc agus socraigh an rogha athuair ar aon athuair. Ansin, cuir an nasc ar an bpointe ionas go mbeidh an téacs laistigh den nasc ar athraíodh a ionad níos faide ar chlé nó ar dheis chun an deilbhín a fheiceáil.
a {padding: 0 2px 1px 15px; cúlra: #fff url (ball.gif) lár ar chlé gan athuair; dath: # c00; }Nuair a bheidh do dheilbhín agat, is féidir leat íomhá difriúil a shocrú mar do dhoiciméid faire, gníomhach agus cuairt a thabhairt chun an nasc a athrú:
a {padding: 0 2px 1px 15px; cúlra: #fff url (ball.gif) lár ar chlé gan athuair; dath: # c00; } a: hover {background: #fff url (ball2.gif) lár ar chlé gan athuair; } a: active {background: #fff url (ball3.gif) lár ar chlé gan athuair; }Déan Do Naisc Féach ar Chnaipí Cosúil
Tá cnaipí an-tóir orthu, ach go dtí go dtáinig CSS, ba cheart duit cnaipí a chruthú trí íomhánna a dhéanamh , rud a fhágann go dtógfaidh do leathanaigh níos faide ualach. Go fortunately, tá stíl teorann a d'fhéadfadh cabhrú leat éifeacht cosúil le cnaipe a chruthú go héasca le CSS.
a {teorainn: 4px outset; stuáil: 2px; maisiú téacs: none; } a: gníomhach {teorainn: 4px inset; }Tabhair faoi deara, nuair a chuireann tú dathanna ar an gcéad dul síos agus i stíleanna inset, ní dócha go mbeidh na brabhsálaithe iontu mar a d'fhéadfadh a bheith ag súil leo. Mar sin, tá cnaipe fancier anseo le teorainneacha daite:
stíl {teorann: soladach; leithead teorann: 1px 4px 4px 1px; maisiú téacs: none; stuáil: 4px; dath teorann: # 69f # 00f # 00f # 69f; }Agus is féidir leat tionchar a imirt ar stíleanna gníomhacha nasc cnaipe freisin, ach bain úsáid as na pseudo-ranganna sin:
a: nasc {teorainn-stíl: soladach; leithead teorann: 1px 4px 4px 1px; maisiú téacs: none; stuáil: 4px; dath teorann: # 69f # 00f # 00f # 69f; } a: hover {border-color: #ccc; }