Jos rakennat verkkosivustoja, sinun on ehdottomasti otettava huomioon asetukset sivujen näyttämiseksi kävijöiden selaimissa. Erityisesti linkkitunnisteiden sisäpuolelle sijoitetut kuvat selaimet esittävät oletusarvoisesti sinisen yhden pisteen (pikseli) leveän reunuksen. Tämä on otettava huomioon sekä sivuelementtien kokoa asetettaessa että niiden värisuunnittelua määritettäessä. Ongelmalle on olemassa vaihtoehtoinen ratkaisu - HTML: n ja CSS: n avulla pakotetaan selaimet olemaan näyttämättä kehystä.
Ohjeet
Vaihe 1
Jos sivumallisi versiossa riittää poistamaan reunus yhdestä tietystä kuvasta linkillä tai vain muutamalla, niin riittää, että lisätään tunnisteisiin nolla-arvoinen reunusmääritelmä. Tämän lisäyksen avulla linkkejä sisältävien kuvien HTML-koodi voi näyttää tältä: Voit käyttää myös tyylimääritteitä - nämä vaihtoehdot vastaavat. Kun tyylimäärite ja siinä määritetty nollaraja-arvo määritetään, sama koodi näyttäisi tältä: Kun käytetään tyylimääritettä, nolla-arvo (0px) voidaan korvata tekstillä "ei mitään" (ilman lainausmerkkejä).
Vaihe 2
Jos haluat estää kehyksen näyttämisen ehdottomasti kaikille sivuille asetetuilla linkeillä olevilla kuvilla, niin on helpompaa tehdä tämä yhdessä paikassa HTML-koodissa. Tätä varten sivutyylien kuvaus ja kaikille linkeille yhteinen sääntö tulisi sijoittaa asiakirjan otsikko-osaan (ja -tagien väliin). Voit kirjoittaa tämän säännön näin: img {border: none;} Se tulisi sijoittaa tunnisteen sisään, joka kertoo selaimelle, että CSS: ssä on tyylien kuvaus täällä:
a img {reunus: ei mitään;}
Vaihe 3
Jos käytät JavaScript-komentosarjoja sivulla, joka suorittaa mitään toimintoja, kun napsautat tekstilinkkiä siirtymättä toiselle sivulle, napsautettuasi joissakin selaimissa ja tekstilinkin ympärillä, samanlainen katkoviiva jää. Voit estää tämän luvattoman muutoksen suunnittelussa lisäämällä sopivan säännön tekstilinkeille CSS-tyylin kuvauslohkoon:
a {ääriviivat: ei mitään;}