Tuossa alempana on kysymys tyylitiedostoista ja siihen on vastattu antamalla linkki opastussivuille. Joko "puusilmä" vaivaa tai sitten en vain löytänyt linkin takaa kaipaamaani tietoa...
Eli.
Olen harjoitellut taulukon ja tekstin ominaisuuksien määrittelemistä tyylien avulla. Se puoli jotenkuten toimiikin ja tulos on halutun lainen. Mutta. Miten linkitetään valmiiksi rakennettu taulukkopohja sivuille, joita teen? Oletetaan, että taulukon eka solu on kuvaa varten, toisessa on teksti ja taulukon seuraavalla rivillä (colspan on 2) on jotain yleislöpinää. Jos haluan käyttää tällaista ratkaisua jokaisella sivullani, miten se käytännössä toimii?
Entä jos haluan vaihtaa kuvaa ja tekstiä? Mihin ja miten se tehdään?
pohdiskelee yksi opiskeleva tumpelo
Eli.
Olen harjoitellut taulukon ja tekstin ominaisuuksien määrittelemistä tyylien avulla. Se puoli jotenkuten toimiikin ja tulos on halutun lainen. Mutta. Miten linkitetään valmiiksi rakennettu taulukkopohja sivuille, joita teen? Oletetaan, että taulukon eka solu on kuvaa varten, toisessa on teksti ja taulukon seuraavalla rivillä (colspan on 2) on jotain yleislöpinää. Jos haluan käyttää tällaista ratkaisua jokaisella sivullani, miten se käytännössä toimii?
Entä jos haluan vaihtaa kuvaa ja tekstiä? Mihin ja miten se tehdään?
pohdiskelee yksi opiskeleva tumpelo
Vastaukset 4
Vanhimmat
Siis laitat ne tyyliäärittelyt (esim) tyyli.css -tekstitiedostoon ja sitten linkität sen tyylitiedoston html dokumenttiin -osioon tollaisella link tagilla.
Sitten jos jossain elementissä haluat käyttää tyyliä niin sitten vaan class -määre perään
Tyylitiedostossa sitten tietty teet noi.
td.solunTyyli1 { ..... }
tr.rivinTyyli5 { ..... }
jne.
Luin tarkemmin kysymyksesi... Siis mitään taulukkopohjia CSS:llä ei voi tehdä. CSS on vain html elementtien ulkoasuun tehtäviä muutoksia varten. Eli html -> data ja struktuuri, CSS -> ulkoasumääritteet edellisille.
Jos kuvaa ja tekstiä haluat muuttaa niin sitten teet uuden html-dokumentin tai esim. javascriptillä teet dynaamisesti muuttuvia juttuja.
Minkälainen tuo css-tekstitiedosto on sitten sisällöltään? Olisko jotain simppeliä esimerkkiä miten määrittelyt kirjoitetaan? Itse olen näissä asioissa ihan vasta-alkaja, vaikka html onkin jo hallussa.
Näillä tyylimääritelmilläkö sitten juuri saadaan aikaan esim. kuvan asettaminen aivan ruudun yläkulmaan ilman mitään marginaaleja? Ja kuinka?
Tattista vaan, jos joku viitsii vastata.
Itse hain apua netistä googlen kautta, löysin esim. tällaiset sivut:
http://myy.helia.fi/~vanvu/css/cssmaarittelyt.html
Nyt täytyy huomioida, että olen varmasti yhtä aloittelija kuin sinäkin, mutta jotain osaan kertoa (tosin viisaammat korjatkoon, jos menee pahasti pieleen ;). Css-tekstitiedosto nimetään siten kuin "selvittäjä" tuossa edellä kertoikin esim. tyyli.css ja tuo .css on se tärkeä tiedoston tunniste. Varsinaiseen html-dokumenttiin tehdään "selvittäjän" mukainen linkki.
Tyylitiedostoon määritelllään ne ulkoasuun vaikuttavat ominaisuudet, jotka halutaan näkyvän html:ssä.
Esimerkiksi:
body {
padding-left:0px;
padding-right:0px;
padding-bottom:15px;
padding-top:0px;
font-size : 0.85em;
font-weight : bold;
font-style : normal;
color : #203775;
line-height: 12pt;
font-family : Verdana;}
Tyylimäärittelyt voi tehdä myös html:n sisällä. Itse tein solun sisäisiä määrityksiä, jotka näkyvät tagiin kirjoitettuna:
Html:ääm linkitettyjä erillisiä tyylitiedostoja eivät (ilmeisesti) kaikki selaimet lue samalla tavalla, joten itse pidän varmempana käyttää sisäistä css:ää.
Juuri tyylimäärittelyillä voi asettaan kuvan tarkasti sinne, minne sen haluaa. Huom - normaalin html:n keinon ei voi vaikuttaa (käsittääkseni) esim. rivinväliin, mutta css:n avulla kyllä. Tällä hetkellä lienee suositeltavinta käyttää css1-versiota, sillä kaikki selaimet eivät vielä (jälleen käsittääkseni...) ymmärrä kakkosversiota.
Katsotaan sitten, miten paljon tämä kirjoitus aiheuttaa oikaisuja :)
Jess. Sehän alkaa suttaantua. Tästä on hyvä jatkaa ja opetella enemmän.
Kiitoksia!