|
Poslao: 06 Jun 2008 15:36
|
offline
- LaserJat
- Super građanin
- Pridružio: 26 Jul 2004
- Poruke: 1472
- Gde živiš: Vojvodina,Zrenjanin
|
Evo ovako imam 2 menija u html napravljenih pomocu lista.Jedan treba da je horizontalan a drugi vertikalan.
<div id="meni">
<ul>
<li><a href="#">prva</a></li>
<li><a href="#">druga</a></li>
<li><a href="#">treca</a></li>
<li><a href="#">cetvrta</a></li>
<li><a href="#">peta</a></li>
</ul>
</div>
.
.
.
<div id="sadrzaj_levo">
<ul>
<li><a href="#">klikni za dalje1</a></li>
<li><a href="#">klikni za dalje2</a></li>
<li><a href="#">klikni za dalje3</a></li>
<li><a href="#">klikni za dalje4</a></li>
</ul>
.
i imam css fajl ovako
a { text-decoration: none; }
a:hover { text-decoration: none }
ul { list-style: none; }
.
.
.
#meni ul li {
float: left;
}
#meni ul li a:link, a:visited {
width: 170px;
height: 20px;
display: block;
float: left;
background: url(meni-bg.gif) repeat-x;
}
#meni ul li a:hover {background-position: bottom;}
.
.
E sad problem je kad je ovako samo, ovaj css se primeni i na div tag sadrzaj_levo(meni koji treba da je vertikalan), valjda zbog onih ul, li, a ...
Zasto? Kako da napravim u css-u da ova dva menija budu skroz nezavisna jedan od drugog.Pocetnik sam u ovim stvarima pa mozda nisam dobro objasnio ali ako treba opet cu  Hvala
Dopuna: 06 Jun 2008 15:36
Ima li nekog ovde da se razume u css? 
|
|
|
|
|
Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
|
|
|
Poslao: 06 Jun 2008 16:47
|
offline
- Rastafarii
- Moderator foruma
- Pridružio: 22 Mar 2006
- Poruke: 3747
- Gde živiš: 127.0.0.1
|
Prvo, zamolio bih te da budes malo strpljiviji, ovde se problemi resavaju na dobrovoljnoj bazi, a vecina od nas ima i posao koji treba da zavrsi.
I jeste jedan horizontalan, a drugi vertikalan, samo sto ti se prvi link iz vertikalnog ne odvaja od horizontalnog menija. Razlog je jednostavan: nigde nisi definisao #sadrzaj_levo meni.
kao sto si za horizontalni meni definisao css:
#meni ul li {
float: left;
}
#meni ul li a:link, a:visited {
width: 170px;
height: 20px;
display: block;
float: left;
background: url(meni-bg.gif) repeat-x;
}
tako definises i za vertikalni (samo sto je #sadrzaj_levo a ne #meni), i naravno, sa njegovim podesavanjima. Float ti ne treba za vertikalni meni, a ne bi bilo lose da u #sadrzaj_levo dodas i sledece:
clear: both;
|
|
|
|
|
|
|
Poslao: 08 Jun 2008 01:07
|
offline
- LaserJat
- Super građanin
- Pridružio: 26 Jul 2004
- Poruke: 1472
- Gde živiš: Vojvodina,Zrenjanin
|
Kao prvo nisam imao nameru nikog da pozurujem vec sam to onako samo napisao ako bolje pogledas videces smajli na kraju recenice.Takodje znam kako se problemi ovde resavaju, nisam prvi put na forumu.
Kao drugo hvala ti odgovoru.
I kao trece jel moze neko da mi objasni kad bude imao slobodnog vremena u cemu je razlika kad se nesto definise sa tackom na pocetku u css
.nesto { bla bla bla;}
a u html se poziva sa
<div class="nesto"
A sta znaci kad je ovako u css
#nesto{bla bla bla;}
a html je
<div id="nesto">
Znaci u cemu je razlika izmedju te dve stvari i sta je bolje koristiti.Hvala
|
|
|
|
|
|
|
Poslao: 08 Jun 2008 01:50
|
offline
- Rastafarii
- Moderator foruma
- Pridružio: 22 Mar 2006
- Poruke: 3747
- Gde živiš: 127.0.0.1
|
Ako u CSS-u definises ID (#nesto), onda se takav objekat (po w3c standardima) koristi samo jednom unutar jedne html stranice. Drugo, i svako sledece pojavljivanje IDa unutar iste html stranice javlja gresku prilikom validacije.
CLASS (.nesto), sa druge strane, mozes da koristis koliko god hoces puta na istoj html stranici, i stranica ce ostati validna.
|
|
|
|
|
|
|
Poslao: 09 Jun 2008 13:40
|
offline
- LaserJat
- Super građanin
- Pridružio: 26 Jul 2004
- Poruke: 1472
- Gde živiš: Vojvodina,Zrenjanin
|
Razumem sad, hvala.
Dopuna: 09 Jun 2008 13:40
Opet mi nesto nije jasno sa ovim css-om, bas me nervira... 
Napravio sam jedan prost primer kako biste me lakse razumeli.
Znaci sa leve strane imam meni sa nekim njegovim efektima uradjen pomocu lista itd... A sa desne strane imam najobicniji link koji ne radi kako treba jer kad predjem misem preko njega ili kliknem na njega on uzima efekte i ponasa se kao onaj meni sa leve strane.Zastoooo to tako radi???
evo css
@charset "utf-8";
/* CSS Document */
#main {
margin: 20px auto 0 auto;
padding: 0;
width:950px;
background-color:#000000;
}
#levo {
margin:5px;
width:440px;
padding: 10px;
background-color:#003366;
float: left;
}
#desno {
margin: 5px;
width: 440px;
padding: 10px;
background-color:#009933;
float:left;
}
ul {
list-style: none;
}
a:link, a:visited {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
text-decoration: none;
font-weight: bold;
}
a:hover {
text-decoration: none;
}
#meni {
margin:0;
padding:0;
float: left;
width:100px;
}
meni ul {
padding: 0;
margin:0;
list-style: none;
}
meni ul li a:link, a:visited {
width:50px;
display:block;
background:#000000;
padding:0;
color:#FF0000;
}
#meni ul li a:hover {
background: #FFFFFF;
color: #000000;
}
A evo i ceo primer
https://www.mycity.rs/must-login.png
Hvala unapred.
|
|
|
|
|
|
|
Poslao: 09 Jun 2008 14:36
|
offline
- Crazy Wiking
- Legendarni građanin
- Pridružio: 13 Jan 2008
- Poruke: 3657
- Gde živiš: Stara Pazova
|
Zato što je tako definisano sa CSS-om i tako će ti se ponašati svaki link. Da bi to izbegao dodaj mu class, recimo ovako:
a:link.dva , a:visited{
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#0000ff;
text-decoration: none;
font-weight: bold;
}
a:hover.dva {
text-decoration: underline;
}
Ovo .dva je class i taj link kome zadaš taj class ponašaće se nezavisno od ovog. Taj link postavljaš ovako
<a href="#" class="dva">Normalan link</a>
Evo ti primer kako to radi:
https://www.mycity.rs/must-login.png
Dopuna: 09 Jun 2008 14:36
Znači imaš u css-u definisan a tag i tako će ti se ponašati svaki link, to je kao podrazumevana vrednost, i imaš a.dva tako će ti se ponašati oni linkovi kojima zadaš class="dva".
Moj ti je savet da meniju dodaš class, a da ti linkovi budu bez class-a jer ćeš imati jedan meni i po nekoliko linkova, pa da ne moraš svakom linku zadavati class.
|
|
|
|
|
|
|
|
