Autor Zpráva
hrncal.junior
Profil
Ahoj,
mám menší problém s oddělovačem v menu. Jde použít jako oddělovač obrázek?
A případně jak? Vůbec nic mě nenapadá. Díky moc
quatzael
Profil
hrncal.junior:
Podle toho čemu říkáš oddělovač.. Jestli myslíš klasicky něco vložit mezi jednotlivý menu položky, tak je asi nejsnazší tam hodit nějaký divy (floatingový jestli to máš horizontálně) a nastavit tam background-image. Obrázek coby <img> bych tam nedával, ale samozřejmě to jde..
margin
Profil *
http://teststranek.kvalitne.cz/menu7.1/
V odkázaném menu je jako oddělovač border-right, ale též je možné použít vhodný obrázek, nějak takto:
#menu a {
background: #baf url(oddelovac.gif) right;
}
Kubo2
Profil
hrncal.junior:
Prvé menu som naštýloval bez oddelovača, zobrazované na riadok.
V druhom menu som použil ako oddelovač pajpu, čo je tento znak: |.
V tom treťom mi ako oddelovač poslúžil výrez z indikácie príspevkov na tomto serveri:

Kód+živá ukážka.
hrncal.junior
Profil
Tak nějak to tam nemůžu dát. Menu bude vypadat takhle
Separátor bude mít cestu. img/sep.png
Popište mi to prosím polopatě. Jak to bude vypadat ten zápis pro oddělovač. Nějak to nedokážu rozchodit. Děkuji Moc
<div id="navigace">
<ul id="menu">
    <li><a href="#">Polozka1</a></li>
    <li><a href="#">Polozka2</a></li>
    <li><a href="#">Polozka3</a></li>
    <li><a href="#">Polozka4</a></li>
  </ul>
</div>



Jo a ještě chci použít takovou šipku, která označí akrivní položku v menu. Když jsem ji v Css nastavil
#menu li:active 
{
background-image: url(img/menu_aktivni.png);
}

tak se mi zobrazila, ale jak jsou položky různě velké, tak mi to dalo třeba 2 obrázky vedle sebe, což nechci. Nevíte co s tím? děkuji
Kubo2
Profil
hrncal.junior:
tak se mi zobrazila, ale jak jsou položky různě velké, tak mi to dalo třeba 2 obrázky vedle sebe, což nechci. Nevíte co s tím? děkuji
Vieme. background-repeat

Použitie:
#menu li:active {
  background-image: url(img/menu_aktivni.png);
  background-repeat: no-repeat;
}
hrncal.junior
Profil
Kubo2:
No ale já potřebuju, aby se ten obrázek roztáhl přes položkju v menu, s tím, že ve středu bude zobáček.
margin
Profil *
Je nespočet možností, jak můžeš mít řešené. Dej odkaz na živou ukázku toho, co zatím máš hotové.
Kubo2
Profil
hrncal.junior:
No ale já potřebuju, aby se ten obrázek roztáhl přes položku v menu, s tím, že ve středu bude zobáček.
S tým ti asi pomôže background-size, nie ja.
Ja som v živej ukážke použil malý obrázok 16x16px a background-position.
margin
Profil *
Kubo2:
Ja som v živej ukážke použil malý obrázok 16x16px a background-position
Další možnost je napasovat k zobáčku dolní border. http://kod.djpw.cz/frab
Je to jen ukázka principu. ve které se "bije" levý a dolní rámeček. Pokud bych něco podobného dělal, tak bych využil toho, že v menu jsou k dispozici dva elementy, položka seznamu <li> a odkaz <a href=>. Ale bez živé ukázky řešení použitého hrncal.juniorem nemíním babrat.
hrncal.junior
Profil
Kód je zde http://kod.djpw.cz/urab
margin
Profil *
Nějak takhle? http://kod.djpw.cz/bsab
hrncal.junior
Profil
Děkuji. Už to krásně šlape :-)


Ještě k tomu zobáčku. Ty dlouhá data jsou mám nahradit zobáčkem?


Ohledně ohraničení. margin

Ještě bych chtěl, aby se místo žluté čáry zobrazoval jako separator obrázek. Jakoukolv barvu s toho udělám, to problém není, ale nějak nevím, jak udělat separátor, který mám jako obrázek
margin
Profil *
hrncal.junior:
Ty dlouhá data jsou mám nahradit zobáčkem?
V těch dlouhých datech je obrázek zobáčku jako data base 64. Udělal jsem to tak proto, abych obrázek nemusel nahrávat někam na internet.
Pro tebe bude vhodné použít standardní postup.

V podstatě jde o to, mít dostatečně široký obrázek se zobáčkem uprostřed, vložit ho na pozadí položky (nebo odkazu) a obrázek na pozadí horizontálně centrovat. Že je obrázek na pozadí zbytečně široký, nevadí, je je formátu PNG a ten umí dlouhé proužky velmi dobře komprimovat.
hrncal.junior
Profil
margin:
Tak ted to konečně chápu. Mě to bylo právě divné, jak to funguje :-)

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0