linkin leveys

miten onnistuu

Miten linkille voi määritellä korkeuden, leveyden ja taustakuvan?

Eli sivulla on kymmeniä linkkejä, ja haluan että kaikilla olisi sama leveys ja korkeus (joka olisi sama kuin linkin taustakuvat koko) ja linkit näyttäisivät nappuloilta.

Onnistuuko tämä mitenkään?

7

468

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Höpö.

      html:

      linkki


      css:

         .link {
            height: 20px;
            width: 100px;
            background: url(kuva.jpg);
            text-align: center;
         }

      • foxytin

        Kaikkihan tietävät että linkit tulee sijoittaa lista-elementtiin, joten tehkäämme niin.


        linkki1
        linkki2
        jne...


        li {
        height: 20px;
        width: 100px;
        background: url(kuva.jpg);
        }


      • Höpö.
        foxytin kirjoitti:

        Kaikkihan tietävät että linkit tulee sijoittaa lista-elementtiin, joten tehkäämme niin.


        linkki1
        linkki2
        jne...


        li {
        height: 20px;
        width: 100px;
        background: url(kuva.jpg);
        }

        ei ollenkaan huono tapa, mutta ei suinkaan ainoa oikea tapa.

        Tapauskohtaisesti.


      • foxytin
        Höpö. kirjoitti:

        ei ollenkaan huono tapa, mutta ei suinkaan ainoa oikea tapa.

        Tapauskohtaisesti.

        Ei tietenkään ainoa oikea tapa. Tuon vain erilaisia vaihtoehtoja esille, josta sitten valita :)

        Periaatteessa suuremmat linkki määrät, kuten navigaatio olisi hyvä sijoittaa listaan. Se olisi semanttisesti oikein. Jos linkit ovat listassa, ne voidaan siirtää muihin medioihin kerralla, helposti. Aivan kuten taulukkomuotoinen data tulee laittaa taulukkoon, josta se on helposti siirrettävissä muihin medioihin (kuten tekstinkäsittelyohjelmat).

        Yksittäiset linkit voidaan laittaa ihan suoraan esimerkiksi p-elementtiin, tai esimerkiksi mainitsemaasi span-elementtiin.

        Tapauskohtainenhan se tottakait on, aivan kuten sanoit.


      • Pilkuton pilkunviilaaja
        foxytin kirjoitti:

        Ei tietenkään ainoa oikea tapa. Tuon vain erilaisia vaihtoehtoja esille, josta sitten valita :)

        Periaatteessa suuremmat linkki määrät, kuten navigaatio olisi hyvä sijoittaa listaan. Se olisi semanttisesti oikein. Jos linkit ovat listassa, ne voidaan siirtää muihin medioihin kerralla, helposti. Aivan kuten taulukkomuotoinen data tulee laittaa taulukkoon, josta se on helposti siirrettävissä muihin medioihin (kuten tekstinkäsittelyohjelmat).

        Yksittäiset linkit voidaan laittaa ihan suoraan esimerkiksi p-elementtiin, tai esimerkiksi mainitsemaasi span-elementtiin.

        Tapauskohtainenhan se tottakait on, aivan kuten sanoit.

        "Periaatteessa suuremmat linkki määrät, kuten navigaatio olisi hyvä sijoittaa listaan. Se olisi semanttisesti oikein."

        Ei se ole semanttisesti sen väärempää laittaa linkkejä muuhun kuin listaan vaikka niitä olisi suurempia määriä sivulla. Tärkein asia on että ovatko linkit listamuotoista tietoa, kuten navigaatiot ovat. Kuten sanoit tapauskohtasta.


        "Yksittäiset linkit voidaan laittaa ihan suoraan esimerkiksi p-elementtiin, tai esimerkiksi mainitsemaasi span-elementtiin."
        "linkki"

        Kun kyse on yksittäisistä linkeistä niin eikös silloin semanttisin ole laittaa ihan semanttinen linkki

        Tietenkin voi tehdä myös


        linkki tekstiä linkki....


        #teksti a{
        height: 20px;
        width: 100px;
        background: url(kuva.jpg);
        text-align: center;
        }


      • Oikein toimivassa selaimessa height- ja width-ominaisuus eivät vaikuta span-elementtiin (ellei sen perusesitysmuotoa muuteta display-ominaisuudella). Tässä span olisi myös turha, koska ominaisuudet voisi antaa suoraan a-elementeille.


    • Jos sivulla on kymmeniä linkkejä, sillä on todennäköisesti aivan liikaa linkkejä.

      Jos haluat linkkien näyttävän nappuloilta, leikit väärässä paikassa väärillä palikoilla. "Links want to be links."

      Linkkien taustakuva on myös varsin huono ajatus.

      Linkille saa toki korkeuden, leveyden ja taustakuvankin, kunhan asettaa sille display: block ja height-, width- ja background-ominaisuuden.

    Ketjusta on poistettu 0 sääntöjenvastaista viestiä.

    Luetuimmat keskustelut

    1. Mitä siellä ABC on tapahtunut

      Tavallista isompi operaatio näkyy olevan kyseessä.
      Alajärvi
      179
      7463
    2. Klaukkalan onnettomuus 4.4

      Klaukkalassa oli tänään se kolmen nuoren naisen onnettomuus, onko kellään mitään tietoa mitä kävi tai ketä onnettomuudes
      Nurmijärvi
      87
      3346
    3. Kuvaile elämäsi naista

      Millainen hän on? Mikä tekee hänestä sinulle erityisen?
      Ikävä
      57
      2355
    4. Kolari Klaukkala

      Kaksi teinityttö kuoli. Vastaantulijoille ei käynyt mitenkään. Mikä auto ja malli telineillä oli entä se toinen auto? Se
      Nurmijärvi
      69
      1502
    5. Ukraina ja Zelenskyn ylläpitämä sota tuhoaa Euroopan, ei Venäjä

      Mutta tätä ei YLE eikä Helsingin Sanomat kerto.
      Maailman menoa
      370
      1448
    6. Kuvaile elämäsi miestä

      Millainen hän on? Mikä tekee hänestä sinulle erityisen?
      Ikävä
      57
      1363
    7. Ooo! Kaija Koo saa kesämökille öky-rempan:jättimäinen terde, poreallas... Katso ennen-jälkeen kuvat!

      Wow, nyt on Kaija Koon mökkipihalla kyllä iso muutos! Miltä näyttää, haluaisitko omalle mökillesi vaikkapa samanlaisen l
      Kesämökki
      20
      1336
    8. Toivoisin, että lähentyisit kanssani

      Tänään koin, että välillämme oli enemmän. Kummatkin katsoivat pidempään kuin tavallisesti toista silmiin. En tiedä mistä
      Ikävä
      17
      1071
    9. Olisinpa jo siellä, otatkohan minut vastaan

      Olisitpa lähelläni ja antaisit minun maalata sinulle kuvaa siitä kaikesta ikävästä, tuskasta, epävarmuudesta ja mieleni
      Ikävä
      79
      1030
    10. Kevyt on olo

      Tiedättekö, että olo kevenee kummasti, kun päästää turhista asioista tai ihmisistä irti! Tämä on hyvä näin <3
      Ikävä
      84
      1028
    Aihe