Kun sijoitat kuvan linkkitunnisteen sisälle (ja väliin), kävijän selain piirtää oletusarvoisesti kuvan ympärille yhden pikselin leveän sinisen reunuksen. Sen lisäksi, että selaimen mielivaltaisuus lisää sivusi tämän muotoiluelementin kokoa kahdella pikselillä pystysuunnassa ja kahdella pikselillä vaakasuunnassa, sininen väri ei välttämättä vastaa sivumallin värejä.
Ohjeet
Vaihe 1
Jos haluat poistaa reunuksen yhdestä tai useammasta linkkikuvasta, voit tehdä tämän lisäämällä reunamääritteen, jonka arvo on nolla, kunkin tarvitsemasi kuvan tunnisteeseen. Esimerkiksi: Sama vaikutus voidaan saavuttaa käyttämällä tyylimääritettä sijoittamalla sama reuna nolla-arvoon: Tämän muunnoksen nolla-arvo (0px) voidaan korvata arvolla "ei mitään" (ilman lainausmerkkejä).
Vaihe 2
Jos sinun on ratkaistava tämä ongelma radikaalisti, toisin sanoen kaikki kuvat, joissa on linkkejä koko asiakirjassa, on parempi tehdä se eri tavalla. Vastaavaa attribuuttia ei tarvitse lisätä kunkin kuvan tunnisteeseen erikseen, kaikille yhteinen sääntö on helpompi kirjoittaa ylös asiakirjan alussa olevaan tyylikuvaan. Tämä CSS-sääntö näyttää tältä: img {border: none;} Se on sijoitettava tyylin kuvauslohkoon ja itse lohko sijoitettava ennen sivun otsikkoa sulkevaa tagia:
a img {reunus: ei mitään;}
Vaihe 3
Kuvien lisäksi myös tietyntyyppisissä selaimissa olevilla yksinkertaisilla tekstilinkeillä on samanlainen ongelma - jos kävijä napsauttaa linkkiä, sen ympärille jää katkoviiva. Jos haluat tallentaa sivusi tältä suunnitteluvirheeltä, lisää seuraava linkkisääntö tyylien kuvauksiin:
a img {ääriviivat: ei mitään;}