Autor Zpráva
Vladosik
Profil *
#1 · Zasláno: 8. 2. 2007, 13:44:46
Odpovědět Citovat
Ahoj. Chci udelat obrazek jako odkaz pres image replecement, vytvoril jsem si class s pozadim toho obrazku a pak class priradil k odkazu, ale nefunguje to, vim ze je neco spatne a takhle to neni spravne, proto se ptam tady. A dalsi vec je, ze se ma jeste pouzit nahrazovani textem, coz vubec netusim jak to udelat?
Muzete mi nekdo poradit? Nebo sem dat nejakej odkaz, kde ten kod uvidim jak se to dela? Diky moc
Plaváček
Profil
#2 · Zasláno: 8. 2. 2007, 13:53:30 · Upravil/a: Plaváček
Odpovědět Citovat
Viz třeba http://www.malenek.cz/cs/clanky/webdesign/nahrazovani-textu-obrazkem

Doplním - v té ukázce je jedna zrada, totiž autor v ní pozicuje nadpis H1 absolutně, což samozřejmě nutné není (postačí position:relative). To jen na okraj.
Vladosik
Profil *
#3 · Zasláno: 8. 2. 2007, 14:14:26
Odpovědět Citovat
Mohl by jste mi to nekdo jeste blize osvetlit? Treba jak presne to mam napsat, kdyz chci obrazek jako odkaz? Z toho odkazu mi to neni jasne, ten kod tam vubec neni vysvetlen.
habendorf
Profil
#4 · Zasláno: 8. 2. 2007, 14:22:45
Odpovědět Citovat
On ten odkaz taky není moc dobrej a kdysi jsem mu to tam napsal.
Vladosik
Profil *
#5 · Zasláno: 8. 2. 2007, 15:14:17
Odpovědět Citovat
No ja to prave cetl. Postupoval jsem podle toho odkazu v diskuzi na te strance a je to v pohode. Az na to, ze ja to potrebuji mit vycentrovany a uz si vubec nevim rady jak na to. Kod mam takto:

<p class="stred domacikina"><a href="..."><span>Domácí kina</span></a></p>

A CSS je takto:

.domacikina {
margin: 0;
padding: 0;}

.domacikina a {
display: block;
width: 200px;
height: 80px;
margin:0;
padding:0;
background: url("obchody/domacikina.jpg") top left no-repeat;
text-decoration: none;}

.domacikina a span {
display: none;}
Vladosik
Profil *
#6 · Zasláno: 8. 2. 2007, 15:15:52
Odpovědět Citovat
Jo trida stred je takto (na normalni obrazky i text a proste vsechno funguje):

.stred {
display: block;
text-align: center;
margin: 0 auto;}
habendorf
Profil
#7 · Zasláno: 8. 2. 2007, 15:19:47
Odpovědět Citovat
Celou deklaraci .stred vyhoď a pro .domacikina a dej místo margin:0; margin:0 auto;
Vladosik
Profil *
#8 · Zasláno: 8. 2. 2007, 15:33:02
Odpovědět Citovat
Jee,super. Diky moc. Jeste bych se chtel zeptat. Ta prvni cast .domacikina se mi zda zbytecne. Ja ji tam mam, protoze tak byl ten kod na te strance. Ale je v ni jen margin a padding, kterej mam i v .domacikina a , a kdyz to odstranim, nic se nestane, je to porad stejne? Muzu to vyhodit? Nebo proc je to tak napsane? Urcite by to tam nebylo zbytecne dvakrat...
habendorf
Profil
#9 · Zasláno: 8. 2. 2007, 15:35:56
Odpovědět Citovat
No, to se dělá ještě jinak, abys to nemusel psát všude. Na začátek css si dej

* {
margin: 0;
padding: 0;
}

a pak už to můžeš vyházet úplně odevšud.
Vladosik
Profil *
#10 · Zasláno: 8. 2. 2007, 15:40:50
Odpovědět Citovat
jj,to vim, ale to zase nechci, to by mi udelal asi strasnej bordel, protoze by se mi tim ovlivnila cela stranka. Mam jeste posledni dotaz. Ten text je nyni jako neviditelny nebo je prekryt obrazkem? Jde mi o to, ze pokud je text neviditelny, vyhledavac by me mohl vyloucit.
habendorf
Profil
#11 · Zasláno: 8. 2. 2007, 15:46:19
Odpovědět Citovat
Teď na to koukám pořádně, ty to máš ale úplně blbě. Teď je text skutečně neviditelný.
Vladosik
Profil *
#12 · Zasláno: 8. 2. 2007, 15:52:53
Odpovědět Citovat
Hm, toho jsem se bal. Jak rikam, ja tohle zkousim ted hodinu. A tenhle kod jsem vzal ze stranek http://www.wellstyled.com/css-replace-text-by-image.html . Jestli nevite o lepsim odkazu nebo jestli je naprava tezka, tak uz to nechte. Sef by mi mel o vikendu poslat syntaxi, jak se to dela, chtel jsem to mit jen dnes hotove a trosku zaperlit...
habendorf
Profil
#13 · Zasláno: 8. 2. 2007, 16:04:29
Odpovědět Citovat
Tak jo, ukončím tvé trápení :o)

<h1><a href="/index.html" title="Home">text<span></span></a></h1>

h1 {
position: relative;
overflow: hidden;
width: 430px;
height: 70px;
}
h1 a {
display: block;
width: 430px;
height: 70px;
cursor: pointer;
padding-top: 12px;
color: #FF9900;
text-align: center;
}
h1 span {
display: block;
position: absolute;
left: 0;
top: 0;
width: 430px;
height: 70px;
background: url('/img/logo.png') no-repeat left top;
}

Místo h1 si můžeš dát třeba div, p ... prostě co potřebuješ.
Vladosik
Profil *
#14 · Zasláno: 8. 2. 2007, 17:01:55
Odpovědět Citovat
jj,ok, diky. Jeste jsem to nezkousel, ale verim ze to funguje. Stejnak s tou neviditelnosti by to nemelo tak vadit. Neviditelny texte stejne posuzuje clovek ne? Takze ten by stranku nevyloucil, protoze by videl, ze v tomto pripade slouzi tak jak ma a obsahuje prakticky jen dve slova a neslouzi tedy k podvodum pro vyhledavani. Aspon tak co jsem o tom cetl a slysel. Ale fakt moc diky za tvuj cas.
habendorf
Profil
#15 · Zasláno: 8. 2. 2007, 17:08:49
Odpovědět Citovat
No ono nejde jen o vyhledáváče. Jde zejména o přístupnost bez obrázků. Což by s tím display:none bylo v háji.
Vladosik
Profil *
#16 · Zasláno: 8. 2. 2007, 17:12:43
Odpovědět Citovat
Tak pravda. Tak dik.
Vladosik
Profil *
#17 · Zasláno: 8. 2. 2007, 17:38:02
Odpovědět Citovat
Jeste jsem narazil na problem, na stejnej jako u toho predtim. Neni to vycentrovany a nepomaha ani to nahore.
habendorf
Profil
#18 · Zasláno: 8. 2. 2007, 17:40:26
Odpovědět Citovat
No zas dáš pro h1 (nebo cos tam dal) margin:0 auto;
Vladosik
Profil *
#19 · Zasláno: 8. 2. 2007, 17:42:48
Odpovědět Citovat
No a to prave nedela vubec nic. Je to porad nalevo.
Vladosik
Profil *
#20 · Zasláno: 8. 2. 2007, 17:52:12
Odpovědět Citovat
Funguji dva zpusoby, kdyz to dam do <center></center>. Coz je samozrejme prasecina a pak to funguje, jen kdyz to necham v tom H1. vztahuje se na to asi definice H1, ktery je centrovan. Predelam to tedy do toho H1, ono je to stejnak vyhodnejsi, H1 ma prioritu ve vyhledavani ne.
Vladosik
Profil *
#21 · Zasláno: 8. 2. 2007, 17:54:25
Odpovědět Citovat
Kecam kraviny. Ale proste to funguje, to je hlavni.
Časová prodleva: 17 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0