CSS - tyylit Seppo Räsänen
|
|
- Kaija Seppälä
- 8 vuotta sitten
- Katselukertoja:
Transkriptio
1 CSS - tyylit Seppo Räsänen
2 Sivu 2 1 CSS-tyylit Dynaaminen HTML tai DHTML on standardi, joiden käyttöä tukevat uusimmat Netscapen ja Microsoftin selaimet. DHTML:n ominaisuuksia ovat tyylitiedostot (style sheets), tasot (layers) ja dynaamiset kirjasimet. Hyvän näköisen web-sivun tekeminen pelkällä HTML-kielellä voi olla joissakin tilanteissa hankalaa tai ainakin tyylillinen päivitettävyys on työlästä. Toinen HTML:n ongelma on hyvän ulkoasun omaavan web-sivuston tekeminen eri selaimilla toimivaksi. World Wide Web Consortion (W3C) standardoimisen yhteydessä syntyi tyylitiedosto (Cascading Style Sheets (CSS)) määrittely. Tyylitiedostot laajantavat HTML-standardeja. Lisäksi tyylitiedostojen avulla ei tarvitse muuttaa HTML-dokumentin rakennetta vaikka tyylillisesti muutettaisiinkin sivustoa. CSS-tyylien avulla voidaan vaikkapa koko sivustossa oleva H1-tagi muuttaa näyttämään kerralla joltakin muulta kuin mitä se on oletuksena. Oletuksena H1-tagin teksti on isolla kirjoittettua mustaa tekstiä. Tyylien avulla voidaan muuttaa mm. tekstin väriä, kokoa, fonttia ja fontin tehosteita. Tyylit perustuvat sääntöihin, syntaksi on element {attribute: value[; attribute: value.]}, missä element määrittelee suunnitteluelementin, johon tyyli kytketään. Elementti on sama kuin HTML-tagi attribute on elementin määrittelyn osa ominaisuus jolle halutaan kohdistaa tyyli. value on asetus, joka on määritetty attribuutille eli se on attribuutin arvo attribute: value on säännön selitysosa. Selitysosia voi olla useita, ne erotelaan toisistaan puolipisteellä (;). Tyylien käyttäminen voidaan tehdä usealla tavalla. Ulkoisessa tyylien määrittelyssä on erillinen tyylitiedosto, johon viitataan HTML-dokumentista. Tämä mahdollistaa saman tyylitiedoston käytön koko sivustolle, jolloin ulkoasullinen päivittäminen voidaan tehdä helposti eli ko. tyylitiedostoa muuttamalla. Upotetussa tyylien määrittelyssä ko. tyylimääritys tehdään ko. sivun HEAD-osaan. Tämä määritys on voimassa vain siinä sivussa, jossa määritys on tehty. Rivinsisäinen tyyli määritetään sivulla olevan tagin sisälle eli sen vaikutus on vain ko. tagin vaikutus alueella. Tasojen avulla määritetään sivulla olevia alueita jonkin tyylimäärityksen mukaisesti. Tyyliluokkien avulla voidaan tyylissä olevasta tagista tehdä useita erilaisia
3 Sivu 3 muunnelmia. Seuraavissa kappaleissa tutustutaan eri tyylien määritys mahdollisuuksiin tarkemmin. Esimerkkinä Internet Explorer 4:n tukemat css-attribuutit liitteessä Ulkoinen tyyli (external) Ulkoisessa tyylissä rakennetaan erillinen tyylitiedosto (*.css). Tiedosto on normaali ascii-tiedosto, jossa tyylisääntöjen avulla on tehty määritykset. Alla olevassa kuvassa on esimerkki ulkoisesta tyylitiedostosta, joka sijaitsee www-palvelimella samassa hakemistossa, missä on tyylin käyttävät sivutkin. Tyylitiedosto voi olla toki muussakin hakemistossa, mutta sen käyttöönottamisessa viitataan vain oikeaan polkuun. Kuva 1. Esimerkki ulkoisesta tyylitiedostosta. Kuvan 1. esimerkissä on määritelty H1, H2 ja P -tagien ominaisuudet tyylisääntöjen avulla. H1- tagille on määritelty fontiksi Arial, fonttikoko on 36, fontti on lihavoitu ja tekstin väri on sininen. Vastaavalla tavalla H2-tagin fontti on Arial, fonttikoko 24, lihavoitu ja väri on vihreä. P-tagin fontti on Courier, pistekoko on 12, vasen marginaali on 0.5 tuumaa ja ylämarginaali on 20 pixeliä pienempi oletusarvoon verrattuna.
4 Sivu 4 Kun tyylitiedosto on tehty se otetaan käyttöön jokaiselle sivulle erikseen. Sivun HEAD-osaan tulee määritys käytettävästä tyylistä. Alla esimerkki ulkoisen tyylin käyttämisestä, huomioi tyylin käyttämiseen liittyvä LINK-tagi - <link rel="stylesheet" href="ulkoinen.css" type="text/css">. Kuva 2. Esimerkki ulkoisen tyylin käyttämisestä Upotettu tyyli (embedded) Upotetussa tyylissä tyylimääritykset tulevat ko. sivulle HEAD-osaan. Tämä tyylimääritys vaikuttaa vain ko. sivulle. Alla olevassa kuvassa on esimerkki upotetusta tyylistä.
5 Sivu 5 Kuva 3. Esimerkki upotetusta tyylistä. Kuva 3 esimerkissä oleva tyyli on määritelty HAED-osaan TITLE-tagin jälkeen. P-tagilla tausta väri on valkea, fontti on Comic Sans MS, pistekoko on 14, vasen ja oikea marginaali on 1 tuumaa ja ylämarginaalia on pienennetty 18 pixelillä. H1- tagille on määritelty taustaväriksi valkea, fontti on Arial Black, tekstin väri on punainen, fonttikoko on 24 sekä vasen ja oikea marginaali on 1 tuumaa. H2-tagille vastaavat määritykset, poikkeuksena tekstin väri on sininen ja pistekoko on Rivinsisäinen tyyli (inline)
6 Sivu 6 Rivinsisäisessä tyylissä tyylimääritykset ovat sivulla olevassa tagissa. Tämä tyylimääritys on voimassa vain tagin määrityksen ajan. Alla esimerkki. Kuva 4. Esimerkki rivinsisäisestä tyylistä. Kuvan 4 esimerkissä on määritetty B-tagille tyylimääritykset style-attribuuttien avulla. Esimerkissä lihavointi toteutetaan vihreällä värillä, kursivoituna ja fonttikoko on 14. Tyylien määrittelyssä voi tulla päällekkäisiä määrityksiä. Esimerkiksi määritetään ulkoinen tyyli B-tagille. Jonkin sivun jossakin kohdassa halutaan käyttää B-tagille rivinsisäistä tyyliä, tällöin tulee ristiriitainen tilanne, kumpi tyylimääritys todella vaikuttaa. Ristiriitaisissa tilanteissa viimeisimmän määrityksen mukaan näytetään ko. tekstiosa Tyyliluokat (class) Tyyliluokan avulla voidaan yhdelle tagille määrittää eri muunnelmia. Esimerkiksi P-tagille voi määrittää luokan, joka tasaa tekstin vasemmalle, toinen luokka tasaa oikealle ja kolmas luokka keskittää tekstin. Samassa tyylimäärityksissä voi olla vaikkapa tekstin tehosteisiin vaikuttavia määrityksiä.
7 Sivu 7 Kuva 5. Esimerkki tyyliluokkien käytöstä, jossa P-tagilla luokkamääritykset. Kuvan 5 esimerkissä H1 ja H2 tagit ovat normaalisti määriteltyjä. Esimerkki käyttää ulkoista tyyliluokkamääritystä. P-tagille on määritetty luokat keski, oikea ja normaali. P.keski määrittää tekstin keskittämisen. P.oikea tasaa tekstin oikeaan reunaan. P.normaali määrittää tekstin kursivoiduksi, 14 pistekokoiseksi ja fonttina on Courier sekä vasen ja oikea marginaali on 1 tuumaa. Edellisen esimerkin ulkoista tyyliä käytetään normaalisti eli www-sivulle määritetään HEADosaan tyylin käyttö. P-tagin käytöstä on esimerkki alla olevassa kuvassa. Huomaa tyyliluokan käytön syntaksi <p class="keski">.
8 Sivu 8 Kuva 6. Esimerkki tyyliluokan käytöstä, jossa käytetään ulkoista tyyliä Tasot (layer) Tyylitiedostot sisältävät tavan luoda erillisiä lohkoja, joita voi sijoitella www-sivulle halutulle paikalle. Lohkot muistuttavat kehyksiä, mutta tasot voivat sijaita missä vaan näyttöä ja niitä voi esim. liikuttaa/päivittää/piilottaa/näyttää scriptien avulla. Tasojen määrittäminen voitiin tehdä <LAYER>-tagin avulla, mutta nykyisin käytetään <DIV STYLE.> -tagimääritystä. Tasot toimivat niin Netscapen kuin Microsoftin selaimilla. <DIV>-tagin STYLE attribuutilla on useita määritysvaihtoehtoja. static määrittää normaalin HTML-määrityksen mukaiset osat, joita ei voi siirtää, oletusarvo absolute määrittää osan, joka sijoitetaan käytettyjen koordinaattien mukaan relative määrittää yksikön, jota siirretään tietyn määrän verran statin sijainnista lukien left ja top määrittävät osan siirron sen normaalista sijainnista width ja height määrittävät tason leveyden ja korkeuden clip määrittää leikkaavan suorakulmion osalle
9 Sivu 9 overflow määrittää, milloin suorakulmio leikkaa osan ja rullaus antaa mahdollisuuden nähdä loput osasta. Arvot ovat none, clip, scroll z-index määrittää päällekkäisyyden visibility määrittää osan näkyvyyden. Arvot ovat visible, hidden, inherit background-color määrittää taustavärin tasolla olevalle tekstille layer-background-color määrittää taustavärin koko tasolle Kuva 7. Esimerkki tasojen käytöstä Div ja span tagit Dhtml:ssä <DIV>-tagin avulla viitataan isompaan alueeseen. Tagille voidaan antaa nimi ID-attribuutin avulla. Edellisessä esimerkissä (kuva 7) käytettiin <DIV>-tagia. <SPAN>-tagilla viitataan vain pieneen tekstialueeseen. Tyypillisesti alue on merkin kokoinen.
10 Sivu 10 Kuva 8. <SPAN>-tagi esimerkki, jossa luettelossa olevan tekstin ensimmäinen merkki on ulkoisen tyylinluokan mukainen Tyylit tiiviimmässä muodossa Jos tyyli olisi... H1 {font-style: italic; font-weight: bold; font-size: 18 pt; font-family: "Times New Roman"}... niin sen voi lyhentää muotoon H1 {font: italic bold 18pt "Times New Roman"} Tai jos tyyli olisi... H1 {font-family: "Arial"; font-weight: bold} H2 {font-family: "Arial"; font-weight: bold} H3 {font-family: "Arial"; font-weight: bold}... niin sen voi lyhentää muotoon H1, H2, H3 {font-family: "Arial" bold} Tyylit voidaan kirjoittaa tiiviimmässä muodossa silloin, kun attribuutti on samaa sukua tai jos useilla tageilla on samat attribuutit.
11 Sivu 11 Lähteet Simpson Alan; Microsoft Internet Explorer Web-ohjelmointi Aitken Peter; Internet-ohjelmointi Visual Basic Moncur Michael; JavaScript Niemi Juha, Kiuttu Petri; Java script ohjelmointi lisää interaktiivisuutta www-sivuillesi Peltomäki, Inkinen, Rantala; CGI- ja ASP-ohjelmointi Reynolds Matthew; e-kauppa (vbscript ja jscript) Microsoft Access2000 ohjeisto
HTML & CSS. HTML (HyperText Markup Language) Antti Koivisto. ! HTML on sivujen kuvauskieli.
HTML & CSS Antti Koivisto HTML (HyperText Markup Language)! HTML on sivujen kuvauskieli.! Se ei ole ohjelmointikieli.! HTML on merkintäkieli, joka koostuu monista merkintä tägeistä ().! Voidaan
LisätiedotHTML-ohjeet. Sivun perusrakenne <HTML> <HEAD> <STYLE TYPE="text/css"> ...tänne tulee CSS-koodi eli sivun ulkonäkö määritykset...
HTML-ohjeet Sivun perusrakenne ...tänne tulee CSS-koodi eli sivun ulkonäkö määritykset... ...tänne tulee javascript-koodi...
LisätiedotCSS-kielen avulla määritellään HTML-dokumentin tyyli. CSS avulla voidaan tarkemmin määritellä eri elementtien ominaisuuksia.
CSS1 CSS (Cascading Style Sheets) CSS-kielen avulla määritellään HTML-dokumentin tyyli. CSS avulla voidaan tarkemmin määritellä eri elementtien ominaisuuksia. Esim.
LisätiedotWWW-sivujen Verkkosivujen ulkoasu (CSS)
WWW-sivujen Verkkosivujen ulkoasu (CSS) T-111.1100 Digitaalisen median työvälineet (3 op) T-111.1100 Digitaalisen median työvälineet (3 op) Markku Laine DI Pia Tukkinen Mediatekniikan laitos Mediatekniikan
LisätiedotLisätehtävät. Frantic 2015 sivu 1 www.frantic.com
Lisätehtävät Frantic 2015 sivu 1 www.frantic.com Fontit - Google fonts Fonttien käyttäminen verkossa ilman uusien fonttien lataamista on melko rajattua, sillä koskaan ei voi tietää mitä fontteja vastaanottajan
LisätiedotCSS. Tekstin muotoilua
CSS Tekstin muotoilua Tekstin muotoilu Kirjasimen ominaisuudet font-family font initial inherit; font-style normal italic oblique initial inherit; font-variant normal small-caps initial inherit; font-weight
LisätiedotH T M L eli kuinka laadin itselleni päheät kotisivut. Janne Käki
H T M L eli kuinka laadin itselleni päheät kotisivut Janne Käki 13.9.2006 Mikä ihmeen HTML? HyperText Markup Language hypertekstiä eli toisiinsa linkitettyjä dokumentteja merkintäkieli, perustuu erilaisiin
LisätiedotAsemointi. 1. Lohkon korkeus ja leveys
Asemointi Asemointi on elementtien sijoittelua. Sisältö: 1. Lohko korkeus ja leveys height, width min-height, max-height, min-width, max-width overflow, overflow-x, overflow-y 2. Float - kelluva sisältö
LisätiedotJohdatusta selainohjelmointiin
Johdatusta selainohjelmointiin Ohjelmat ja tyylit selaimessa ja HTML Jaana Holvikivi Selaimet ja HTML Selaimet: Internet Explorer, Exchange Firefox, Chrome Opera 10 Safari 4 Lukevat HTML sivuja ja asettelevat
LisätiedotWWW-sivujen Verkkosivujen ulkoasu (CSS)
WWW-sivujen Verkkosivujen ulkoasu (CSS) ME-C2300 Verkkojulkaisemisen perusteet (5 op) T-111.1100 Digitaalisen median työvälineet (3 op) Antti Tolppanen DI Pia Tukkinen Mediatekniikan laitos Mediatekniikan
LisätiedotH T M L eli kuinka laadin itselleni päheät kotisivut. Janne Käki 13.9.2006
H T M L eli kuinka laadin itselleni päheät kotisivut Janne Käki 13.9.2006 Mikä ihmeen HTML? HyperText Markup Language hypertekstiä eli toisiinsa linkitettyjä dokumentteja merkintäkieli, perustuu erilaisiin
LisätiedotCascading Style Sheets
Cascading Style Sheets CSS - Cascading Style Sheets tyylikuvauskieli suunniteltu HTML:ää varten 1996, oma syntaksi CSS1 (1996), CSS2 (1998), CSS Mobile Profile CSS3 (tuleva) selaintuki nykyään hyvä, mutta
LisätiedotUlkopuolisen tyylitiedoston käyttö
1 CSS - aloitus Sisältö: s. 2. Ulkopuolisen tyylitiedoston käyttö s. 3. Tyyliohjeen kirjoittaminen s. 4. style-elementti s. 5. style-attribuutti s. 6. class-attribuutti s. 7. id-attribuutti s. 8. Fontit
LisätiedotXHTML - harjoitus. Tehtävä1: Tee xhtml tiedosto käyttäen notepad (muistio) ohjelmaa. Tiedoston tallennus notepad (muistio) ohjelmassa:
XHTML - harjoitus Tehtävä1: Tee xhtml tiedosto käyttäen notepad (muistio) ohjelmaa Tiedoston tallennus notepad (muistio) ohjelmassa: Jokaisen XHTML-dokumentin tulisi alkaa XML-määrittelyllä(engl.XML-prologue),
LisätiedotVerkkosivut perinteisesti. Tanja Välisalo 11.2.2009
Verkkosivut perinteisesti Tanja Välisalo 11.2.2009 WWW-sivujen vieminen omaan kotisivutilaan yliopiston mikroverkossa https://salasana.jyu.fi Klikkaa painiketta Activate WWW Klikkaa painiketta Activate
LisätiedotCSS aloitus. CSS Cascade Stylesheet Mirja Jaakkola
CSS aloitus CSS Cascade Stylesheet Mirja Jaakkola Sisältö 3. Ulkopuolisen tyylitiedoston käyttö 4. Tyyliohjeen kirjoittaminen 5. style-elementti 6. style-attribuutti 7. class-attribuutti 8. id-attribuutti
LisätiedotVerkkojulkaiseminen Minna Väisänen. HTML5-tehtävä
Verkkojulkaiseminen Minna Väisänen HTML5-tehtävä Kirjoita Dreamweaverissa oheisen nettisivun koodi. Lisää xx-kohtiin omat tietosi. Kuvan nimi on joki.jpg. Ensin tehdään sivusto ja sitten yksittäinen sivu.
Lisätiedotvalitsin on useimmiten html-elementti, jolle tyyli halutaan luoda
Valitsimista valitsin on useimmiten html-elementti, jolle tyyli halutaan luoda Muistin virkistykseksi elementtejä http://appro.mit.jyu.fi/doc/www/xhtml/ HTML-elementtien lisäksi valitsimille voidaan luoda
LisätiedotWritten by Administrator Wednesday, 05 October 2011 08:06 - Last Updated Monday, 17 October 2011 15:28
Sivupohja Joomlalle Sivupohjan tekeminen Joomlalle itse alusta saakka kuulostaa vaikealle. Työ on kuitenkin varsin helppo, jos vaan tietää tekemisen kaavan ja ymmärtää idean sivupohjasta. Joomlalle sivupohjan
LisätiedotXML, XHTML ja CSS. T-111.361 Hypermediadokumentin laatiminen. Mikko Pohja
XML, XHTML ja CSS T-111.361 Hypermediadokumentin laatiminen Mikko Pohja Sisältö XML Yleensä Eri kieliä XHTML CSS XSL XML EXtensible Markup Language W3C Recommendation helmikuu 1998 SGML:n osajoukko Standard
LisätiedotKuva xhtml-sivulla. Mirja Jaakkola
Kuva xhtml-sivulla Mirja Jaakkola Sisältö 3. Kuva www-sivulla 4. img-elementti 5. Kuvan koko 6. Kuvan keskitys vaakasuoraan & kuvateksti 7. Kuvan tasaus pystysuoraan 8. Esimerkki: pystysuora tasaus eri
Lisätiedotselector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård
selector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård CSS selectorit Elementti HTML CSS otsikko h1 { color: pink; Luokka HTML CSS
LisätiedotHTML5 -elementit jatkuu
HTML5 -elementit jatkuu Harjoitus: xhtml.htm -> html5.htm Muuta tämä xhtml dokumentti HTML5:ksi: http://users.metropolia.fi/~norrm/s12/kalasu/xhtml.htm Validoi myös koodisi: http://validator.w3.org/ "Mallivastaus"
LisätiedotDigitaalisen median tekniikat css tyylimääritykset jatkuu
Digitaalisen median tekniikat css tyylimääritykset jatkuu 31.3.2004 Harri Laine 1 CSS fontit font-family: pilkulla eroteltu luettelo fonttinimiä, ensimmäistä listasta löytyvää fonttia käytetään fontit
LisätiedotDigitaalisen median tekniikat css tyylimääritykset jatkuu Harri Laine 1
Digitaalisen median tekniikat css tyylimääritykset jatkuu 31.3.2004 Harri Laine 1 CSS fontit font-family: pilkulla eroteltu luettelo fonttinimiä, ensimmäistä listasta löytyvää fonttia käytetään fontit
Lisätiedot1. Lohkon korkeus ja leveys
Asemointi Asemointi on elementtien sijoittelua. Sisältö: height, width float - kelluva sisältö position Elina Ulpovaara 13.10.2009 1. Lohkon korkeus ja leveys Leveys - width Korkeus - height - mittayksiköt
LisätiedotTaulukot. 1. Taulukon rakenne: ICT01D Elina Ulpovaara
Taulukot Taulukoita käytetään XHTML:ssä taulukkomuotoisen tiedon esittämiseen esim. tilastot, hinnastot jne sivun ulkoasun muotoiluun eli taittoon - voidaan korvata CSS:n asemointia käyttäen ICT01D 28.11.2005
LisätiedotCascading Style Sheets
Cascading Style Sheets CSS - Cascading Style Sheets tyylikuvauskieli suunniteltu HTML:ää varten 1996, oma syntaksi CSS1 (1996), CSS2 (1998), CSS Mobile Profile CSS3 (tuleva) selaintuki nykyään hyvä, mutta
LisätiedotDigitaalisen median tekniikat css tyylimääritykset Harri Laine 1
Digitaalisen median tekniikat css tyylimääritykset 30.4.2004 Harri Laine 1 Sisällön ja ulkoasun erottaminen toisistaan tavoiteltavaa sama sisältö pitäisi voida esittää erilaisilla alustoilla esim. esittää
LisätiedotDigitaalisen median tekniikat css tyylimääritykset
Digitaalisen median tekniikat css tyylimääritykset 26.3.2004 Harri Laine 1 Sisällön ja ulkoasun erottaminen toisistaan tavoiteltavaa sama sisältö pitäisi voida esittää erilaisilla alustoilla esim. esittää
LisätiedotAlkuun HTML5 peliohjelmoinnissa
Paavo Räisänen Alkuun HTML5 peliohjelmoinnissa www.ohjelmoimaan.net Tätä opasta saa vapaasti kopioida ja levittää ei kaupallisissa tarkoituksissa. Sisällysluettelo 1: Alkusanat 2: Alkuun 3: Pelinäkymä
LisätiedotCSS - aloitus. ICT01D syksy 2005 Mirja Jaakkola, Helia. Ulkopuolisen tyylitiedoston käyttö
CSS - aloitus ICT01D syksy 2005 Mirja Jaakkola, Helia Ulkopuolisen tyylitiedoston käyttö Tyylimääritykset sijaitsevat erillisessä.css-tiedostossa, joka linkitetään xhtml-dokumenttin head-lohkossa linkelementillä:
LisätiedotHTML ja CSS. Tästä se lähtee: portfolio-sivusto. Sivuston pääkansio, jonka sisällä on kaikki sivustoon kuuluvat alikansiot ja tiedostot.
HTML ja CSS Tästä se lähtee: portfolio-sivusto Sivuston pääkansio, jonka sisällä on kaikki sivustoon kuuluvat alikansiot ja tiedostot. index.html Sivuston pääsivu, joka avautuu selaimeen ensimmäisenä sivujen
LisätiedotTyylien käyttö. <LINK href="mystyle.css" rel="stylesheet" type="text/css"> 5 WWW-hypermedian perusta: HTML
Tyylien käyttö Tyylien (style) ideana on HTML:n tapauksessa erottaa toisistaan dokumentin rakenne ja ulkoasu Tavoitteena on, että dokumentin loogisen rakenteen ja ulkoasun koodaus erotetaan toisistaan
LisätiedotT-111.361 Hypermediadokumentin laatiminen. Sisältö. Tavoitteet. Mitä on www-ohjelmointi? Arkkitehtuuri (yleisesti) Interaktiivisuuden keinot
T-111.361 Hypermediadokumentin laatiminen -Ohjelmointi Peruskäsitys www-ohjelmoinnin kentästä Tekniikat interaktiivisuuden toteuttamiseen tekniikat tekniikat Tietokannat Juha Laitinen TKK/TML juha.laitinen@hut.fi
LisätiedotTutkitaan sitten HTML-dokumenttien anatomiaa, jotta päästään käsiksi rakenteisten dokumenttien käsitteistöön esimerkkien kautta.
3 HTML ja XHTML Tutkitaan sitten HTML-dokumenttien anatomiaa, jotta päästään käsiksi rakenteisten dokumenttien käsitteistöön esimerkkien kautta.
LisätiedotUlkoasun muokkaus CSS-tiedostossa
Ulkoasun muokkaus CSS-tiedostossa Nellin ulkoasun muokkaus CSS-tiedostossa Lähes kaikki on muokattavissa css-tyylitiedosta käsin. Jokaiselle kieliversiolle on oma tyylitiedostonsa: www_v_fin/metalib.css
LisätiedotSisältö. XML, XHTML ja CSS XML XML. XML:n ja HTML:n ero. XML kieliä XML XHTML CSS XSL. T Hypermediadokumentin laatiminen 2002
, XHTML ja CSS T-111.361 Hypermediadokumentin laatiminen 2002 XHTML CSS XSL Sisältö EXtensible Markup Language W3C Recommendation helmikuu 1998 SGML:n osajoukko Standard Generalized Markup Language Kevyempi
LisätiedotVerkkosivujenulkoasu
Verkkosivujenulkoasu ulkoasu (CSS) WWW-sivujen ME-C2300 Verkkojulkaisemisen perusteet (5 op) T-111.1100 Digitaalisen median työvälineet (3 op) Aleksi O Connor DI Pia Tukkinen laitos Mediatekniikan Mediatekniikan
LisätiedotCode Camp for Girls. Sanna Nygård. Lokakuussa 2015 www.frantic.com/codecamp/
Code Camp for Girls Sanna Nygård Lokakuussa 2015 www.frantic.com/codecamp/ HTML? HTML? HyperText Markup Language Ei ole nettisivua ilman HTML:ää Rakenteinen, hierarkkinen dokumentti Vain rakenne ja sisältö,
LisätiedotWWW-sivujen Verkkosivujen ulkoasu (CSS)
WWW-sivujen Verkkosivujen ulkoasu (CSS) ME-C2300 Verkkojulkaisemisen perusteet (5 op) T-111.1100 Digitaalisen median työvälineet (3 op) Pinja Hokkanen DI Pia Tukkinen Mediatekniikan laitos Mediatekniikan
LisätiedotAT4-kotisivukurssi. 4. jakso 5.2. 5.4.2013.
AT4-kotisivukurssi 4. jakso 5.2. 5.4.2013. Ohjeita, kotisivueditori HTML-opas http://www.iki.fi/mikaves/html/ (Mika Westerholm) Kotisivueditorit: Notepad (yksinkertainen BlueGriffon (tehokas, ilmainen)
LisätiedotProseduraalinen dokumentti: sisältö, rakenne ja ulkoasu yhdessä, esim. worddokumentti
1 XHTML - aloitus Sisältö: s.2 Taustaa s.4 Elementin rakenne s.7 XHTML dokumentti s.8 DOCTYPE s.11 html s.13 head s.14 meta s.16 title s.17 link s.18 style s.19 body s.22 Lohko- ja inline-elementit s.23
LisätiedotDigitaalisen median tekniikat css tyylimääritykset
Digitaalisen median tekniikat css tyylimääritykset 18.9.2007 Harri Laine 1 Sisällön ja ulkoasun erottaminen toisistaan tavoiteltavaa sama sisältö pitäisi voida esittää erilaisilla alustoilla esim. esittää
LisätiedotNotepad++ on ilmaisohjelma ja sen voi ladata osoitteesta: http://notepad-plus-plus.org/
1 HTML-perusteita HTML on lyhenne sanoista Hyper Text Markup Language. Aluksi oli kyse tekstidokumenteista, jotka oli linkitetty toisiinsa nk. hyperlinkkien avulla. Nykyään HTML-dokumentit sisältävät paljon
LisätiedotKotisivut helposti - osa 4
Kotisivut helposti - osa 4 Artikkelisarjan kolmessa ensimmäisessä osassa esiteltiin Internet-siviuihin sekä XHTML- ja CSS-ohjelmointikieliin liittyviä perusteita. Tässä osassa kerrotaan, miten aiemmin
LisätiedotEntiteetit erotetaan muusta tekstistä & ja puolipiste. esim. copyright-merkki näkyy sivulla
1 ENTITEETIT Tehtävä 1. Tietokoneet ja käyttöjärjestelmät käyttävät erilaisia merkkijärjestelmiä ja varsinkin Internetin alkutaipaleella aiheutti sen, että jotkut merkit eivät näkyneet kaikilla oikein.
Lisätiedothttp://www.microsoft.com/expression/
Verkkojulkaisuharjoitus1 TAVOITE Harjoituksen tarkoituksena on opiskella käyttämään verkkojulkaisueditoria (Microsoft Expression Web) ja käynnistämään verkkosivu internetissä. VERKKOSIVUEDITORIN KÄYTTÖOHJEITA
LisätiedotUpdateIT 2010: Editorin käyttöohje
UpdateIT 2010: Editorin käyttöohje Käyttäjätuki: Suomen Golfpiste Oy Esterinportti 1 00240 HELSINKI Puhelin: (09) 1566 8800 Fax: (09) 1566 8801 E-mail: gp@golfpiste.com Sisällys Editorin käyttöohje...
LisätiedotDigitaalisen median tekniikat. Luento 3: CSS
Digitaalisen median tekniikat Luento 3: CSS Luennot 1. Intro 2. XHTML 3. CSS Box Model Selektorit Esimerkkiä yms. 4. JavaScript 5. JavaScript-kirjastot & AJAX 6. Käytettävyys & saavutettavuus 7. Palvelinohjelmointi
LisätiedotTIEDEJUTTUKURSSI 29.9.2011 FM VILLE SALMINEN
TIEDEJUTTUKURSSI 29.9.2011 FM VILLE SALMINEN YLEISTÄ LUENNOT (8 H) & TYÖPAJA (2 H) YHTEYSTIEDOT ville.salminen@oulu.fi VÄLINEET Tekstieditori Mieluummin Windowsin Notepad kuin esimerkiksi Microsoft Word
LisätiedotKylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8.
Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8.2012 Hakemisto 1. Sivustot internetissä... 2 2. Yleistä... 2 3.
LisätiedotTee html-sivu, jossa on yllä olevat kaksi taulukkoa.
TAULUKKO 1 Taulukoiden avulla voidaan informaatio esittää havainnollisesti esimerkiksi palstoitettuna. Lisäksi voidaan sijoittaa eri elementit haluttuihin paikkoihin (taulukkotaitto). Taulukko luodaan
LisätiedotKuvat. 1. Selaimien tunnistamat kuvatyypit
Kuvat Kuvia voi liittää xhtml-sivulle -elementillä -elementillä -elementillä lomakkeiden yhteydessä lähinnä painikenappeja taustakuvina -elementin background-attribuutilla tai
LisätiedotASP ja DHTML. 27.8.2004 Seppo Räsänen
ASP ja DHTML 27.8.2004 Seppo Räsänen Liite 3 Sisällys 1 Tietokantojen käyttö sivuilla ASP-tekniikka...3 1.1. ASP ja VBScript...3 1.2. ASP ja J(AVA)Script...9 1.3. ASP ja Access...9 Lähteet...9 Himapizza-esimerkki...10
LisätiedotWWW-Sivustojen suunnittelu. Miten WWW toimii. Suunnittelun lähtökohdat 14.10.2010
WWW-Sivustojen suunnittelu Miten WWW toimii Web-selain hakee Web-sivun HTML-kielisen kuvauksen Sivuun liittyvät kuvat (jpeg, gif, png) Sivuun liittyvät muut elementit Palvelimen URL-osoite esim. http://www.metropolia.fi
LisätiedotWWW-Sivustojen suunnittelu
WWW-Sivustojen suunnittelu Miten WWW toimii Web-selain hakee Web-sivun HTML-kielisen kuvauksen Sivuun liittyvät kuvat (jpeg, gif, png) Sivuun liittyvät muut elementit Palvelimen URL-osoite esim. http://www.metropolia.fi
LisätiedotSuomalainen Verkkokauppa: Ohjeita verkkokaupan ulkoasun suunnittelijalle
Suomalainen Verkkokauppa: Ohjeita verkkokaupan ulkoasun suunnittelijalle Pyydämme suunnitelijaa ottamaan huomioon seuraavat ohjeet verkkokaupan ulkoasun suunnittelua koskien. Näin vältämme lisäkustannukset
LisätiedotOpinnäytetyö Toni Hurskainen Porin ammattiopisto / Tekniikkaopisto Sähköala TT03
Opinnäytetyö 5.4.2006 Toni Hurskainen Porin ammattiopisto / Tekniikkaopisto Sähköala TT03 Sisällysluettelo 1. Johdanto... 3 2. Suunnittelu... 4 2.1. PTOPlus.net... 4 2.2. Sivujen tarkoitus ja kohderyhmä...
LisätiedotWWW-ohjelmoinnin kokonaisuus. WWW-OHJELMOINTI 1 Merkkauskielet. Merkkauskielten idea. Merkkauskielet (markup languages) Merkkauskielten merkitys
WWW-OHJELMOINTI 1 WWW-ohjelmoinnin kokonaisuus SGML, XML, HTML WWW-selaimen sovellusohjelmointi WWW-palvelimen sovellusohjelmointi Eero Hyvönen Tietojenkäsittelytieteen laitos Helsingin yliopisto 26.10.2000
LisätiedotQT tyylit. Juha Järvensivu 2008
QT tyylit Juha Järvensivu juha.jarvensivu@tut.fi 2008 Sisällys QStyle Style sheet Tyyli (QStyle) Kapseloi widgettien Look And Feel ominaisuudet Toteutettu QT:ssa QStyle luokkaan Sisäänrakennettuja tyylejä
Lisätiedot3 CSS ja teknisesti laadukas Web-sivu
3 CSS ja teknisesti laadukas Web-sivu 3 CSS ja CSS ja teknisesti laadukas Web-sivu Johdanto luentokerran aihepiiriin: Nykyaikaisen Web-hypermedian toteuttaminen on HTML-kielen ja CSS-tyylien yhteispeliä
LisätiedotAjatus kaiken taustalla
HTML ja tyylit Ajatus kaiken taustalla Perimmäisenä tarkoituksena tarjota formatointi- ja taittokieli, jonka avulla elementtirakenteisten dokumenttien ulkoasun määrittely voidaan irrottaa sisällön ja rakenteen
LisätiedotEditorin käyttö. TaikaTapahtumat -käyttöohje
Editorin käyttö TaikaTapahtumat -käyttöohje Yleistä ohjelmasta etaika-järjestelmän HTML-moduuli sisältää tekstieditorin, joka on monipuolinen apuväline tehtäessä materiaalia sivustolle (esim. tapahtumakohtaiset
Lisätiedot1 Yleistä Web-editorista... 3. 1.1 Web-editori -dokumentin luominen... 3. 2 Pikatoimintopainikkeet... 3. 2.1 Tallenna... 3
Web-editori 2 Optima Web-editori -ohje Sisällysluettelo 1 Yleistä Web-editorista... 3 1.1 Web-editori -dokumentin luominen... 3 2 Pikatoimintopainikkeet... 3 2.1 Tallenna... 3 2.2 Peru / Tee uudelleen...
LisätiedotOhjeet Finna- julisteen PowerPoint- pohjan muokkaamiseen
Ohjeet Finna- julisteen PowerPoint- pohjan muokkaamiseen Ennen kuin aloitat: 1. Asenna tietokoneeseesi ilmainen Miso Regular fontti, jonka saat täältä: https://www.fontspring.com/fonts/marten- nettelbladt/miso
LisätiedotMITÄ JAVASCRIPT ON?...3
JavaScript MITÄ JAVASCRIPT ON?...3 YLEISTÄ JAVASCRIPTIN SYNTAKSISTA...3 KÄSKYSANAT JA MUUT VARATUT SANAT...3 MUUTTUJIEN, FUNKTIOIDEN JA LUOKKIEN NIMISSÄ...3 HTML-TAGEIHIN VIITTAAVISSA METODINIMISSÄ...3
LisätiedotHTML ja CSS. T WWW-palvelun suunnittelu Mikko Pohja
HTML ja CSS T-111.4360 WWW-palvelun suunnittelu Mikko Pohja Sisältö HTML XHTML CSS DOM DHTML Käytännön esimerkkejä Kuka tahansa pystyy tekemään yksinkertaisen dokumentin HTML Hyper Text Markup Language
LisätiedotFrontPage 2000 - Näkymät
FrontPage 2000 - Näkymät FrontPagessa on kuusi erilaista näkymää sivustoon. Sivunäkymä Tässä näkymässä luodaan sivut eli näkymä vastaa paljolti Wordin tekstinkäsittelyohjelman näkymää. Tässä on myös muokattava
LisätiedotNavigointi Verkkomultimedia ICT1tn004
Navigointi Verkkomultimedia ICT1tn004 27.9.2009 Elina Ulpovaara Käytettävyys navigoinnista Sivuston sisältö hahmottuu nopeasti hyvän navigoinnin avulla. Navigointi on helppoa ja nopeaa. Mitä sivulla on?
LisätiedotOulun yliopiston www-sivujen tekeminen
Oulun yliopiston www-sivujen tekeminen Oulun yliopiston ja sen yksiköiden www-sivuilla noudatetaan yliopiston www-politiikan peruslinjauksia sekä graafisen ohjeiston mukaista visuaalista linjaa. Yhtenäisellä
LisätiedotARVO - verkkomateriaalien arviointiin
ARVO - verkkomateriaalien arviointiin Arvioitava kohde: Jenni Rikala: Aloittavan yrityksen suunnittelu, Arvioija: Heli Viinikainen, Arviointipäivämäärä: 12.3.2010 Osa-alue 8/8: Esteettömyys Edellinen osa-alue
LisätiedotKotisivuohjeet. Eteläpohjalaiset Kylät ry. Sivupohjien rakenne
Kotisivuohjeet Tässä ohjeessa käydään läpi kotisivujen tekemisen perusteet keskittyen html-koodiin ja sen ominaisuuksiin. Sivupohjissa ulkoasu ja rakenne on pääasiassa jaettu erilliseen css-tyylitiedostoon,
LisätiedotXML & CSS. WWW-sovellus??
XML & Näkökulmia WWW-ympäristön sovelluksiin ja käyttöliittymiin ILKKA PALOLA Citec Information WWW-sovellus?? Informaationhallinta, julkaisutoiminta Verkkoviestintä ESIMERKKEJÄ käyttäjistä ja käyttökohteista:
LisätiedotCSS. Historia. Tämä materiaali vastaa kysymyksiin kuten:
CSS CSS on merkintäjärjestelmä, jolla voidaan esittää selaimille dokumenttien ulkoasua koskevia ehdotuksia. Yhtä kokonaisuutta sanotaan tyyliohjeeksi eli tyylisäännöstöksi, englanniksi style sheet. (Korpela
LisätiedotAndroid ohjelmointi Tunti 2. Käyttöliittymät ja resurssit
Android ohjelmointi Tunti 2 Käyttöliittymät ja resurssit Debug Log luokka mahdollistaa debug tulostamisen ADB:n kautta konsoliin (esim. DDMS:ään) esim. Log.println(Log.INFO, TAG, Tämä on println ); Voidaan
LisätiedotHTML-dokumenttien keskeiset piirteet
HTML-dokumenttien keskeiset piirteet HEAD-osa BODY-osa HTML:n ydinattribuutit ([core attributes]) Keskeiset kieleen liittyvät attribuutit, kansainvälisyys Lohkotyyliset elementit & tekstityyliset elementit
LisätiedotHTML-dokumenttien keskeiset piirteet. Keskeinen HTML-merkkaus == XHTML Basic. Hypertekstilinkit. Teksti
en keskeiset piirteet HEAD-osa BODY-osa HTML:n ydinattribuutit ([core attributes]) Keskeiset kieleen liittyvät attribuutit, kansainvälisyys Lohkotyyliset elementit & tekstityyliset elementit Kuvaileva
LisätiedotHEIKKINEN YHTIÖT YRITYSILME 071212
LOGON PERUSVERSIO PERUSVERSIO Ensisijaisesti käytettävä versio logosta. Käytetään valkoisella tai hyvin vaalealla pinnalla. PERUSVERSIO PUNAINEN NEGA Käytetään tässä ohjeistossa määritellyllä punaisella
LisätiedotGRAAFINEN OHJEISTUS. Graafinen ohjeisto
GRAAFINEN OHJEISTUS LOGO SLOGANILLA Elämän peruspilarit Tunnus kokonaisuutena kuvaa vahvaa I-kirjainta viitaten Iisalmen kaupungin nimeen. Logon kantava idea tulee Koljonvirran pohjassa säilyneistä alkuperäisen
LisätiedotSisältö. Graafisen ohjeiston tarkoitus 3 Typografia 4-5 Logo ja liikemerkki 6 Värimaailma 7 Huomioitavaa logosta ja väreistä 8 Maskotti 9 Pohjia 10-12
Graafinen Ohjeisto Sisältö Graafisen ohjeiston tarkoitus 3 Typografia 4-5 Logo ja liikemerkki 6 Värimaailma 7 Huomioitavaa logosta ja väreistä 8 Maskotti 9 Pohjia 10-12 Ella Nurminen Työssäoppimisen näyttötyö
Lisätiedot,QWHUQHWVHODLPHQNl\WWlPLQHQ±,QWHUQHW([SORUHU
,QWHUQHWVHODLPHQNl\WWlPLQHQ±,QWHUQHW([SORUHU Tässä pääsette tutustumaan Internet Explorerin (IE) käyttöön. Muitakin selainversioita löytyy, kuten esimerkiksi Netscape, Opera ja Mozilla. Näiden muiden selainten
LisätiedotGraafinen ohjeisto. Päivitetty tammikuussa 2015
Graafinen ohjeisto Päivitetty tammikuussa 2015 Sisällys Sisällys Esipuhe Liikemerkki ja logo Värit korteille ja kirjepohjalle Typografia Fontit korteille ja kirjepohjalle Kirje- ja esityspohja Käyntikorttipohjat
LisätiedotKotisivut helposti - osa 3
Kotisivut helposti - osa 3 Tämän artikkelisarjan kahdessa ensimmäisessä osassa esiteltiin Internet-sivujen perusteita, kotisivujen suunnittelulähtökohtia sekä HTML/XHTML-ohjelmoinnin perusteita ja yleisimmin
LisätiedotSATAKUNNAN AMMATTIKORKEAKOULU. Hakala Toni Varpelaide Heidi TEKSTINKÄSITTELYN OHJEET CASE: OPINNÄYTETYÖN RAPORTOINTI WORDILLA
SATAKUNNAN AMMATTIKORKEAKOULU Hakala Toni Varpelaide Heidi TEKSTINKÄSITTELYN OHJEET CASE: OPINNÄYTETYÖN RAPORTOINTI WORDILLA Liiketalous ja tietojenkäsittely Huittinen Liiketalous Taloushallinto 2005 1
LisätiedotCSS - tekstit. Tyylisivut
CSS - tekstit Sisällys: Tyylien käyttö Tekstit: Fontit, värit, korostukset Tasaus, välistykset ICT01D 28.11.2005 Elina Ulpovaara Tyylisivut Tyylisivut on dokumentin esitysasua koskeva ehdotus, joka on
Lisätiedot1. ALKUSANAT... 3 2. TUNNUS... 3 3. VÄRIT... 3 4. MERKKI JA LOGOTYYPPI... 4 5. SUOJA-ALUE... 5 6. TUNNUKSEN KÄYTTÖ... 5 7. MONIVÄRI...
GRAAFINEN OHJEISTO 1. ALKUSANAT... 3 2. TUNNUS... 3 3. VÄRIT... 3 4. MERKKI JA LOGOTYYPPI... 4 PÄÄLLEKKÄISVERSIO... 4 RINNAKKAISVERSIO... 4 5. SUOJA-ALUE... 5 6. TUNNUKSEN KÄYTTÖ... 5 7. MONIVÄRI... 5
LisätiedotMicrosoft Visual Studio 2005
Microsoft Visual Studio 2005 on integroitu kehitysympäristö (Integrated Development Environment) eli (IDE). Kehitysympäristöön kuuluvat seuraavat keskeiset sovelluskehitysvälineet: Ohjelmointikielet C#.NET
LisätiedotPaikallisen nuorisoseuran. graafinen ohjeisto. Mikä on graafinen ohjeisto ja sisällys
Paikallisen nuorisoseuran graafinen ohjeisto Mikä on graafinen ohjeisto ja sisällys Graafinen ohjeisto tukee Suomen Nuorisoseurojen visuaalista ilmettä sekä auttaa ilmeen yhdenmukaisuuden säilyttämisessä.
LisätiedotYlläpitoalue - Etusivu
Crasmanager 5.2 Ylläpitoalue - Etusivu Sivut osiossa sisällön selaus ja perussivujen ylläpito. Tietokannat osiossa tietokantojen ylläpito. Tiedostot osiossa kuvien ja liitetiedostojen hallinta. Työkalut
LisätiedotKÄYTTÖOHJE. Servia. S solutions
KÄYTTÖOHJE Servia S solutions Versio 1.0 Servia S solutions Servia Finland Oy PL 1188 (Microkatu 1) 70211 KUOPIO puh. (017) 441 2780 info@servia.fi www.servia.fi 2001 2004 Servia Finland Oy. Kaikki oikeudet
Lisätiedot6.1 Tekstialueiden valinta eli maalaaminen (tulee tehdä ennen jokaista muokkausta ym.)
6. Tekstin muokkaaminen 6.1 Tekstialueiden valinta eli maalaaminen (tulee tehdä ennen jokaista muokkausta ym.) Tekstin maalaaminen onnistuu vetämällä hiirellä haluamansa tekstialueen yli (eli osoita hiiren
LisätiedotKirjasinleikkaukset ja fontit
Kirjasinleikkaukset ja fontit 1 Fontti on merkki- ja symbolijoukko, jolla on erityinen malli. Tätä erityistä mallia kutsutaan kirjasinleikkaukseksi. Valitsemasi kirjasinleikkaukset lisäävät asiakirjaan
LisätiedotFonttimuotoilut. Fontin tyyppi ja fonttikoko
Fonttimuotoilut Kun haluat muotoilla jonkin sanan tai osan tekstistä, sinun pitää ensin "maalata" ko. alue. Maalaaminen tapahtuu vetämällä alueen yli hiiren ykköspainike alas painettuna. Maalattu alue
LisätiedotKotisivujen teko. Jan Lindholm Kirkkonummen kansalaisopisto Syksy koodari.eu jsbin.com
Kotisivujen teko Jan Lindholm Kirkkonummen kansalaisopisto Syksy 2014 koodari.eu jsbin.com Käyttäjätunnus / Salasana aoppilas.01 / aoppilas#2013# aoppilas.02 / aoppilas#2013# aoppilas.03 / aoppilas#2013#
LisätiedotRATA-SM -sarjan graafinen ohjeistus Alkusanat Kuvapankki
GRAAFINEN OHJEISTUS RATA-SM -sarjan graafinen ohjeistus Tähän ohjeeseen on koottu RATA-SM -sarjan ulkoisessa ja sisäisessä viestinnässä käytettävien materiaalien ulkoasua koskevat ohjeet. Tärkeää on muistaa
LisätiedotJAVA on ohjelmointikieli, mikä on kieliopiltaan hyvin samankaltainen, jopa identtinen mm. C++
JAVA alkeet JAVA on ohjelmointikieli, mikä on kieliopiltaan hyvin samankaltainen, jopa identtinen mm. C++ ja Javascriptin kanssa. Huom! JAVA ja JavaScript eivät silti ole sama asia, eivätkä edes sukulaiskieliä.
Lisätiedot3 WWW-hypermedian perusta: HTML
3 WWW-hypermedian perusta: HTML Hypertext Markup Language HTML (Hypertext Markup Language) on tapa koodata (merkata) rakenteisia (teksti)dokumentteja WWW:ssä Esimerkki: Tästä kaikki alkaa
LisätiedotOpinnäytteen nimi ja mahdollinen alaotsikko (tämä pohja toimii parhaiten Word2010-versiolla)
T A M P E R E E N Y L I O P I S T O Opinnäytteen nimi ja mahdollinen alaotsikko (tämä pohja toimii parhaiten Word2010-versiolla) Kasvatustieteiden yksikkö Kasvatustieteiden pro gradu -tutkielma NIMI NIMINEN
LisätiedotKanta graafinen ohje. Versio
Kanta graafinen ohje Versio 3.0 17.3.2014 Sisältö Kirjoitusasu Tunnus Värillinen, musta valkoinen, värillisellä taustalla ja pohjalla sekä suoja-alue, mittasuhteet ja kieliversiot Tunnus ja nimi aukikirjoitettuna
Lisätiedot