Demosivulla jokainen hr-elementti saa taustakuvan perinteisen vaakaviivan sijaan. Homma tietysti CSS:n avulla toimii, eli näin:
hr {
margin: arvo;
border: 0;
height: arvo;
width: 100%;
background: url(../hakemistopolku/kuvaan.png) no-repeat 50% 0;
}
Melko pitkälti samanlainen temppu on käytössä tuolla Kuopassa.com:in portfolio-osastolla. Sivujen alaosassa näkyvä koristekuva paljastuukin normaaliksi <hr /> -palikaksi, kun katsotaan korean pinnan alle ja sivun lähdekoodin.
Koska aika on arvokasta, kannattaa tutustua tähän alla näkyvään listaan jos mielit löytää tämän nettisivuston parhaat kirjoitukset. Tässä alapuolella on kaikkein luetuimpia kirjoituksia Korinaa kuopasta -blogin aarreaitasta. Kirjoitukset on järjestetty suosituimmuusjärjestykseen siten, että luettelon kärjessä on tällä hetkellä eniten lukukertoja saaneet kirjoitukset.
Blogimerkintää "Taustakuva hr-elementille" muokattiin viimeksi 2007 päivää sitten, eli sunnuntaina 13.08.2006 kello 00:12. Kirjoitukseen on julkaistu kommentteja 7 kpl. Kaikki kirjoituksen saamat kommentit löytyvät suoraan tämän tekstimötikän alapuolelta.
Taas yksi hyödyllinen vinkki sinulta. Kiitos! Uskon, että tämä tulee tarpeeseen.
Vaihda tuon esimerkin taustaväriä muuten. Ei meinaa erottaa niitä kuvia,”viivoja” tai miksi niitä kutsummekaan.
Mitenkä muuten onnistuu tp:llä tollainen kommentonti juttu? Tarkoitan tuota kun väri vaihtuvat joka toisessa. Itse asentelin tp:n yhdille kotisivuistani muutama päivä sitten. Vielä on totuttelemista jonkun verran ja säätöä.
Mitä me tekisimmekään ilman css:ää.
Nämä kommenttien vaihtuvat taustavärit on toteutettu sillä tavalla, että pluginin avulla liitetään jokaiseen kommenttiin class-ryhmäselektori, johon voidaan sitten tarttua CSS-määrittelyin. Jos, parahin nimimerkki Mehukas, haluat samanlaista systeemiä omaan Textpatternilla toimivaan sivustoosi/blogiisi, asenna silloin ensin tuo plugin “ajw_comment_alt” ja aktivoi se. Lue liitännäisen ohjeet ja noudata niitä. :-)
Miika: Aivan, valitettavasti tiedämme kyllä mitä me tekisimme jos CSS:ää ei olisi. Kaivahan takaraivostasi pari muistikuvaa taulukkotaitosta ja spacer-kuvista…
Takaraivoni pyrkii unohtamaan..
Sain muuten tästä merkinnästä inspiraation väsätä hooärriä omaan blogiin, jei.
Ihan kivahan tämä mutta eikös tämäkin ole aika itsestään selvyys. Tosin tämä ei taida toimia antiikkiselaimilla, mutta eikös se ole aika selvää että kaikkeen saa tausta. Noh, niille jotka sitä eivät tienneet niin tämä auttoi ;). Itse tätä en tule käyttämään, mielummin laitan kappaleeseen nuo taustakuvat ja vähän paddingia. Tosin samalla kannattaa muistaa ettei liikaa kuvia sivustoon työnnä. Tosin css ja div taitolla tehdyt sivustot ovat aina kevyempiä kuin vanhanaikaiset tabletukset.
Sori, jos olin vähän tylyn kuuloinen, oli vaan vähän huono päivä, hyvä vinkkihän toi on, eritoten kun se näkyy ilman tyylitiedostoakin, siis tilallahan näkyy silloin viiva semmoisenhan hr aiheuttaa.
Monethan ovat huomanneet ettei tuo toimi vanhoilla selaimilla. Jos sitten viivan haluat pois kun kuvaa ei näy niin laita siihen vanhojen selainten korjaustiedostoon display: none , toinen joka toimii vain jossain selaimissa on border: 0; tai none sillä silloinkin joissain selaimissa viiva katoaa.
Eihän sitä anteeksi kannata pyytää jos on mielipiteitä tai tuntemuksia jostakin asiasta. Tuo opas, jos sitä nyt sillä arvonimellä edes kehtaa kutsua, on tosiaan hyvin simppeli tapaus. Tätä blogiahan saattaa lukea sellaisiakin henkilöitä, jotka ovat vasta tutustumassa näihin nykyajan tyylitiedostoihin ja nettisivujen tekemiseen liittyviin perusasioihin — ehkä heille tuosta on jotain apua.
Oho! Tämän julkaisun kommentointi onkin jo suljettu. Kun tämän julkaisun kommentointi oli vielä avoinna, tälle julkaisulle kirjoitettiin yhteensä 7 kommenttia. Tämä artikkeli on lokeroitu kategoriaan Korinaa. Tämän julkaisun kestolinkin osoite on http://www.kuopassa.com/weblog/2006/08/04/taustakuva-hr-elementille.
Selaat tällä hetkellä blogimerkintää Taustakuva hr-elementille.. Se julkaistiin %. päivä elokuuta 2006. Voit siirtyä lukemaan blogin tuoreimpia kirjoituksia klikkaamalla tiesi weblogin etusivulle. Tässä blogissa julkaistaan kiinnostaviksi katsomiani asioita, joten jos tiedät kiinnostavan nettiin liittyvän aiheen, josta kannattaisi kirjoittaa, laita palautetta!
