Hypertekstimerkintäkielen HTML: n keksimisen jälkeen verkkodokumenttien asettelun ja asettelun käsitteet ovat muuttuneet dramaattisesti. Suosittujen selainten melkein täydellä tuella CSS- ja CSS2-CSS-tyylitaulukoiden standardeille on tullut mahdollista vaikuttaa melkein mihin tahansa asiakirjan visuaalisen esityksen osaan. Voit esimerkiksi tehdä linkin taustasta värillisen, täytetyn kuvalla ja muuttuvan myös käyttäjän toimista riippuen.
Tarpeellinen
- - kyky muokata asiakirjan tekstiä tai asiakirjan tyylisivun tekstiä;
- - tekstieditori, jonka avulla voit tallentaa asiakirjan alkuperäiseen koodaukseen.
Ohjeet
Vaihe 1
Tee linkin taustasta tasaisesti satunnainen väri lisäämällä inline-tyylitiedot A-elementtiin. Lisää tyyli A-elementin attribuutteihin, jotka vastaavat linkkiä, jonka taustaa haluat muuttaa. Lisää tyylimääritteen sisältöön taustavärin CSS-ominaisuus annetulla arvolla, joka on oikea taustavärin tunniste. Se voi esimerkiksi näyttää tältä:
linkkiteksti
Vaihe 2
Määritä linkin tausta asiakirjan ulkoisessa tai upotetussa tyylitaulukossa. Lisää sopivaan tyylitaulukkoon joukko sääntöjä, joihin valitsin on kohdistanut hyväksyttävän tarkkuustason. Kirjoita sääntöjoukon taustaväri-ominaisuus samalla tavalla kuin edellisessä vaiheessa. Valitse valitsimen tarkkuus CSS2-kaskadointisääntöjen ja halutun laajuuden perusteella. Joten jos sinun on asetettava vain yhden linkin väri, on järkevää käyttää tunnuksen valitsinta, jos tällaisia linkkejä on useita, on parempi käyttää määritteen valitsinta luokan arvon perusteella.
Voit esimerkiksi asettaa vihreän taustan tietylle linkille asiakirjassa lisäämällä sääntöjoukon tyylitaulukkoon:
# ID_GREEN
{
taustaväri: # 00FF00;
}
Sinun tulisi myös asettaa A-elementin ID-attribuutti, joka vastaa haluttua linkkiä ID_GREEN:
linkkiteksti
Vaihe 3
Täytä linkin tausta kuvalla. Noudata vaiheissa 1 ja 2 kuvattuja tapoja, mutta käytä taustavärin CSS-ominaisuuden sijaan taustakuvaa. Esimerkiksi:
linkkiteksti
Lisää tarvittaessa tausta-toisto-ominaisuus CSS-sääntöihin, jotka määrittelevät vaihtoehdot taustakuvan kopioimiseksi vaaka- ja pystysuunnassa.
Vaihe 4
Muuta linkin tausta, kun viet sen päälle tai kun tarkennus liikkuu. Lisää sääntöjoukkoja ulkoiseen tai upotettuun asiakirjatyylitaulukkoon, joka määrittelee linkin tai linkkiryhmän taustan eri tiloissa. Käytä tunnus- ja attribuuttivalitsimia yhdessä dynaamisten näennäisluokkien kanssa: hover,: active ja: focus. Esimerkiksi jotta linkin, jonka ID-attribuutin arvo on ID_DYNAMIC_BACKGROUND, tausta olisi passiivisessa tilassa punainen ja vihreä hiiren kohdistimen alla olevassa tilassa, seuraavat sääntöjoukot on lisättävä tyylitaulukkoon:
# ID_DYNAMIC_BACKGROUND
{
taustaväri: # FF0000;
}
# ID_DYNAMIC_BACKGROUND: vie hiiri
{
taustaväri: # 00FF00;
}
Voit tehdä saman luoda tausta dynaamisesti muuttuvalla kuvalla.
