Eli siis kuulin, että CSS olisi ohjelma, jolla voisi nopeasti vaihtaa ulkoasun vaihtamalla sen vaan yhdelle sivulle. Niin, että mitenköhän tämä onnistuisi? Älkääkä pliis antako mitään englanninkielisiä sivuja, kun en niitä jaksa selailla, että mieluummin ihan omaa juttua. Ja jos sen yhden sivun, jolla vaihtaa koko ulkoasun tekee CSS:llä niin voinko tehdä muut ihan tavallisesti HTML-koodeilla muistiolla vai eikö se käy?
CCS:llä nopea ulkoasun vaihto
7
544
Vastaukset
- Poro1
css on tyylitiedosto jossa määrätään mm. linkkien värit, taustat, tekstien koko, väri, fontti, jne.
Tee sivut tavallisesti muistiolla (?) ja sivulle vain linkitys tähän .css tiedostoon.
Googlella löytyy monta sivua jossa asiasta lisää... - Töppö
Css ei ole ohjelma sen enempää kuin html.
Html on merkintäkieli, jolla esitetään sivun rakenne, css on tehniikka jolla määritellään ulkoasu.
Tää nyt ei varmasti ole paras mahdollinen opas, mutta varmaan tuosta saat ainakin jonkinlaisen peruskäsityksen siitä missä mennään:
http://koti.mbnet.fi/~petepe/css1/
Googlella tosiaan löytyy oppaita pilvin pimein.
Css-määritykset voi upottaa ihan html-komentojen joukkoon, mutta suositeltavampaa on käyttää erillista css-tiedostoa joka linkitetään kaikille sivuille. Editorina voi käyttä Notepadia, mutta ihan oikeita css-editoreitakin löytyy. Itse käytän TopStyleä ( http://www.bradsoft.com/download/index.asp ). Lite versio on ilmainen ja se riittää pitkälle.- Töppö
http://www.csszengarden.com/tr/finnish/
Tämä ei ole opas vaan ihan esimerkki siitä miten sivun ulkoasu voidaan muuttaa täysin erilaiseksi pelkästään tyylitiedostoa vaihtamalla. - VOLVO
Töppö kirjoitti:
http://www.csszengarden.com/tr/finnish/
Tämä ei ole opas vaan ihan esimerkki siitä miten sivun ulkoasu voidaan muuttaa täysin erilaiseksi pelkästään tyylitiedostoa vaihtamalla.Mutta jos tekisin muuten tavan sivut HTML-koodeilla muistion avulla niin tekisinkö vaan toiseen muistioon tämän ulkoasun? Ja miten voin laittaa linkin tähän ulkoasu-tiedostoon? En kyllä tiedä onnistuuko se noin, mutta toivon.
- Töppö
VOLVO kirjoitti:
Mutta jos tekisin muuten tavan sivut HTML-koodeilla muistion avulla niin tekisinkö vaan toiseen muistioon tämän ulkoasun? Ja miten voin laittaa linkin tähän ulkoasu-tiedostoon? En kyllä tiedä onnistuuko se noin, mutta toivon.
..jos haluat. Tosin itse käytän mieluummin editoria.
--------- index.html ----------
Esimerkki
Otsikko
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
-------------------------------
---------- tyyli.css ----------
body {
background-color: #FFEFD5;
font-family: Arial, Helvetica, sans-serif;
padding-left: 300px;
padding-right: 50px;
}
#sisalmys {
border: 1px solid White;
padding: 10px;
text-align: justify;
}
h1 {
color: #DCA8FF;
}
------------------------------
Tai vaihtoehtoisesti tyylitiedosto voisi olla tällainen:
---------- tyyli.css ----------
body {
background-color: White;
font-family: monospace;
color: Gray;
}
#sisalmys {
margin-left: 9em;
}
h1 {
color: Red;
margin-left: 9em;
}
------------------------------
No nää nyt ei ollu mitään huippuhienoja esimerkkejä mut kuiteskii.. - VOLVO
Töppö kirjoitti:
..jos haluat. Tosin itse käytän mieluummin editoria.
--------- index.html ----------
Esimerkki
Otsikko
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
-------------------------------
---------- tyyli.css ----------
body {
background-color: #FFEFD5;
font-family: Arial, Helvetica, sans-serif;
padding-left: 300px;
padding-right: 50px;
}
#sisalmys {
border: 1px solid White;
padding: 10px;
text-align: justify;
}
h1 {
color: #DCA8FF;
}
------------------------------
Tai vaihtoehtoisesti tyylitiedosto voisi olla tällainen:
---------- tyyli.css ----------
body {
background-color: White;
font-family: monospace;
color: Gray;
}
#sisalmys {
margin-left: 9em;
}
h1 {
color: Red;
margin-left: 9em;
}
------------------------------
No nää nyt ei ollu mitään huippuhienoja esimerkkejä mut kuiteskii..Miten saa tuohon tyyli.css:ään tälläisen taulukon:
teksti
teksti
teksti
Ja siihen tyyli.css:ään miten saan nämä :
{scrollbar-face-color: #9C8972;
scrollbar-highlight-color: black;
scrollbar-3dlight-color: #94826C;
scrollbar-darkshadow-color: #94826C;
scrollbar-shadow-color: black;
scrollbar-arrow-color: black;
scrollbar-track-color: #94826C;}
A:link{color:#453F32;cursor:crosshair;text-decoration:none}
A:visited{color:#453F32;cursor:crosshair;text-decoration:none}
A:active{color:#453F32;cursor:crosshair;text-decoration:none}
A:hover{color:white;cursor:crosshair;text-decoration:none;
border-left:1px #000000 dotted; border-right:1px #000000 dotted;
border-top:1px #000000 dotted; border-bottom:1px #000000 dotted;}
body {font-family:verdana;color:#000000;font-size:10px;}
body {background-image:url(http://www.jotain.com);}
Jos voisitte auttaa kun en itse onnistu tässä :/ - Töppö
VOLVO kirjoitti:
Miten saa tuohon tyyli.css:ään tälläisen taulukon:
teksti
teksti
teksti
Ja siihen tyyli.css:ään miten saan nämä :
{scrollbar-face-color: #9C8972;
scrollbar-highlight-color: black;
scrollbar-3dlight-color: #94826C;
scrollbar-darkshadow-color: #94826C;
scrollbar-shadow-color: black;
scrollbar-arrow-color: black;
scrollbar-track-color: #94826C;}
A:link{color:#453F32;cursor:crosshair;text-decoration:none}
A:visited{color:#453F32;cursor:crosshair;text-decoration:none}
A:active{color:#453F32;cursor:crosshair;text-decoration:none}
A:hover{color:white;cursor:crosshair;text-decoration:none;
border-left:1px #000000 dotted; border-right:1px #000000 dotted;
border-top:1px #000000 dotted; border-bottom:1px #000000 dotted;}
body {font-family:verdana;color:#000000;font-size:10px;}
body {background-image:url(http://www.jotain.com);}
Jos voisitte auttaa kun en itse onnistu tässä :/Taulukkoa ei laitetaa tyylitiedostoon, taulukot kuuluvat html-dokumenttiin.
Ja kun kerran tarkoituksesi on käyttää css:ää niin kannattaisi jättää suosiolla pois vanhentuneet html-attribuutit kun ne on kätevämpi korvata sillä css:llä.
Tarkoitan näitä:
height="300"
border="2"
align=left
width=150
bgcolor=green
---------- index.html ----------
Jaska
teksti
teksti
teksti
---------- tyyli.css -----------
body {
background-image : url(http://www.jotain.com);
color : #000000;
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size : 10px;
}
table {
border : 2px solid;
height : 300px;
width : 600px;
}
td{
border : 2px solid;
}
#solu1, #solu2 {
background-color : #008000;
height : 500px;
}
#solu1{
width : 150px;
}
#solu2 {
width : 500px;
}
a:link, a:visited, a:active{
color : #453F32;
cursor : crosshair;
text-decoration : none;
}
a:hover{
border-bottom : 1px #000000 dotted;
border-left : 1px #000000 dotted;
border-right : 1px #000000 dotted;
border-top : 1px #000000 dotted;
color : #FFFFFF;
cursor : crosshair;
text-decoration : none;
}
Ketjusta on poistettu 0 sääntöjenvastaista viestiä.
Luetuimmat keskustelut
Vasemmistohallitus palauttaa hintasääntelyn, esim. bensalitra vain 1e.
Tuleva vasemmistolaisista koostuva hallitus ottaa käyttöön vanhat hyvät keinot pitää hinnat kurissa. Tähän tarkoitukse834597Vasemmistolainen valehteli jälleen - Purra tai persut eivät luvanneet "euron bensaa"
Väite "euron bensasta" on ensisijaisesti poliittisten vastustajien käyttämä puhdas vale. Persut kyllä kampanjoivat näky1103820Arman Alizadin viesti puna-aktivisteille: "Pitäkää lärvinne nytkin kiinni"
Arman Alizad kritisoi vasemmiston kaksinaismoralismia. Iranissa syntynyt suosikkijuontaja Arman Alizad pakeni perheensä1733612Minja Koskela nostanut vasemmistoliiton kannatuksen ennätykseen
Koskela valittiin puolueen johtoon lokakuussa 2024, ja silloin Ylen kysely antoi puolueelle 9,3 prosentin kannatuksen.552046Antti johtaa Petteriä jo 7,1 prosenttiyksiköllä
Tällä menolla sdp menee kokoomuksesta kierroksella ohi jo tällä vaalikaudella. https://yle.fi/a/74-20213575711928Mitä on tullut
Entisen abcn rakennuksen tilalle se oli tyhjillään monta vuotta siellä oli jo nyt valot onko huoltoasema? 5:30.891259- 1291104
Palosta selvinnyt 18 vuotias munira tarvitsi tulkin kun puhui Iltalehdelle
Suomessa asuva 18 vuotias tarvii tulkin !!! Tää Suomea puhumaton on palossa kuolleen naisen veli ja asui perheen kanssa.1401050- 57963
Mikä homma?
https://share.google/NvruSS4P4EzjTWPov Poliisilla oli keskiviikkona 4. maaliskuuta yksityisasunnossa Saarijärvellä tehtä27882