css background

pozdravljeni

mi lahko kdo pove, kako se pravilno naredi ozadje strani z css-jem v DW?
lp

17 odgovorov

body {
background-color: #FFFFFF;
}

za ozadje bele barve... za drugo barvo pac spremeni hex kodo...

hvala!

kaj pa kaksen link na slovensko stran, kjer so opisani vsi tagi
in css nastavitve?

pa se to me zanima za predprejsnje vprasanje:

kateri selector type določimo, če želimo narediti css samo za določitev ozadja?
tag ali class (name- body)
lp

Za kaksno slovensko stran o tem se nisem slisal, najdes pa vse mogoce informacije tukaj: http://www.w3schools.com/
sicer v anglescini, ampak brez znanja anglescine tako ali tako ne bos prisel dalec na internetu

drugega vprasanja pa ne razumem povsem, z zgornjo kodo smo dolocili samo ozadje celemu telesu dokumenta in nic drugega...

ok

glede vprasanja:

<head>
<link href="css1.css" rel="stylesheet" type="text/css" />
</head>

...........

body {
background-color: #339999;
}

je tako pravilno?
verjetno je treba narediti nov stylesheet (class) za to, da lahko določimo ozadje strani.
se ponavadi še kaj nastavi na ta stylesheet?
ali je treba naredit nove, in če,
kako je smiselno urediti stylesheete? (kakšna je navadno vsebina oz struktura css slogov na neki strani)

lp

CSS - cascading style sheets -> najboljsa struktura je kaskadna :)

jaz ponavadi dolocim vse globalne zadeve v body deklaraciji (ozadje, barva besedila, font in velikost besedila), potem pa naredim containerje za header, vsebino (mogoce locen container za menu) in footer, vsakemu containerju (DIV) dolocim ID in potem dolocim glavne lastnosti za posamezen container, recimo:

#header {
background-color: #000000;
color: #FFFFFF;
}
#content {
background-color: #FFFFFF;
color: #000000;
}
.
.
.

Potem pa znotraj vsakega containerja dolocim se lastnosti za posamezne tage in lastnosti za posamezne razrede (class), recimo:
#header a {
/* anchor tag /
text-decoration: underline;
color: #FF0000;
}
#header h1 {
/
heading 1 /
font-size: 20px;
}
#header p.hilite {
/
paragraph class="hilite" */
color: #EEEEEE;
}
.
.
.

verjetno je treba narediti nov stylesheet (class) za to, da lahko določimo ozadje strani.

gornja koda ti doloci ozadje za <body> tag, ne rabis nobenega posebnega classa za to...

Obcutek imam, da ti CSS sistem ni povsem jasen... Povej, lahko razlozim od zacetka...

bi prosil se za kaksen nasvet, ja (se pa ne mudi, ko boš (boste) imel čas..)

predvsem osnovno razumevanje cssjev in kako se pise html kodo

pa npr- kaksna je razlika med spreminjanjem Page properties in uporabo CSS?

ce prav razumem so stvari v osnovi določene, s cssji pa jih spreminjamo (pri urejanju besedila)
in pa zakaj so boljši od tabel?
ali pa kako se naredi en container (<div id="1">Content for id "1" Goes Here</div> (?))

Lp

HTMLja te ne bom ucil, imas na w3schools.com kar dobre tutoriale... Malo bi ti le povedal nekaj zadev v razmislek, za lazje razumevanje vsega skupaj...

HTML (HyperText Markup Language) je opisni jezik za opisovanje spletnih dokumentov. Opisujes strukturo dokumenta in (lahko) tudi izgled (vedno manj, temu je zadnje case namenjen CSS).

Osnovna struktura dokumenta:
<html>
<head>
... head definition ...
</head>
<body>
<h1>heading goes here</h1>

content goes here</p>
</body>
</html>

Gornja zelo enostavna struktura je v obliki drevesa... HTML je deblo, ki ima dve veji, oziroma dva otroka (child): HEAD in BODY. V HEAD se tukaj nisem spuscal, ker nima nobene veze s CSS, razen da vanj vstavis CSS definicijo, kar si, kot sem opazil, ze osvojil. BODY ima pa spet dve veji, oziroma dva otroka: H1 in P. Ce bi zelel cisto striktno drevesno definirat CSS za to strukturo, bi naredil to takole (ni potrebe tega poceti tocno na ta nacin, le v ilustracijo):

body {
/* css definicija BODY elementa in vseh njegovih otrok /
}
body h1 {
/
css definicija H1 elementa (in vseh njegovih otrok), ki je otrok elementa BODY /
}
body p {
/
css definicija P elementa (in vseh njegovih otrok), ki je otrok elementa BODY */
}

Ce bi zadeve se bolj gnezdil, recimo takole:
<body>
<div id="header">
<h1>heading 1 goes here</h1>

paragraph text goes here</p>
</div>
<div id="content">
<h2>heading 2 goes here</h2>

paragraph text goes here</p>
<h2>heading 2 goes here</h2>

paragraph text goes here</p>
</div>
</body>

bi css izgledal nekako takole:
body {
/* css definicija BODY elementa in vseh njegovih otrok /
}
body div#header h1 {
/
css definicija h1 elementa (in vseh otrok), ki je otrok div elementa z IDjem "header", ki je otrok BODY elementa /
}
body div#header p {
/
css definicija p elementa (in vseh otrok), ki je otrok div elementa z IDjem "header", ki je otrok BODY elementa /
}
body div#content h2 {
/
css definicija h2 elementa (in vseh otrok), ki je otrok div elementa z IDjem "content", ki je otrok BODY elementa /
}
body div#content p {
/
css definicija p elementa (in vseh otrok), ki je otrok div elementa z IDjem "content", ki je otrok BODY elementa */
}

Tisto "(in vseh otrok)" ne drzi povsem, saj se razlicne lastnosti ne dedujejo, primer je background in text-decoration, pa se kaj bi se naslo. Za tocen seznam, katere lastnosti se dedujejo, si lahko pogledas na w3schools.com

V praski lahko povsod izpustis tisti BODY na zacetku, lahko tudi div#content napises samo #content, zakompliciral sem toliko zato, da ponazorim, o cem sploh govorim :) Zgornji primer bi v praski izgledal takole:

body {
/* css definicija BODY elementa in vseh njegovih otrok /
}
#header h1 {
/
css definicija h1 elementa (in vseh otrok), ki je otrok div elementa z IDjem "header", ki je otrok BODY elementa /
}
#header p {
/
css definicija p elementa (in vseh otrok), ki je otrok div elementa z IDjem "header", ki je otrok BODY elementa /
}
#content h2 {
/
css definicija h2 elementa (in vseh otrok), ki je otrok div elementa z IDjem "content", ki je otrok BODY elementa /
}
#content p {
/
css definicija p elementa (in vseh otrok), ki je otrok div elementa z IDjem "content", ki je otrok BODY elementa */
}

In da, lahko me tikas :)

bom malo povadil
najlepša hvala!

se nekaj me zanima- ce v kodi html "tipkamo" space, enter- ima to kakšen vpliv na stran? ali pa če po pomoti pripišemo zraven kakšen znak, npr. piko.

in pa- pri prejšnjem primeru- zakaj je v body-ju samo h1 in p? (vsaj še h2, h3, h4, h5, h6?)

  1. katerokoli stevilo zaporednih whitespace-ev (space, newline, tab, ...) se v HTMLju smatra kot eden...
  2. napisal sem samo primer, seveda lahko vstavis tja tudi h2, h3, h4, h5, h6, b, i, strong, em, a, p, ul, ol, div, span, img, kar zelis :)