9143
HTML-szerkesztés kezdőknek!!!
-
#3487 #3415 -
#3486 Ha kikommentezem <!--...-->) az <a href="main.htm"> és a </a> közti részt,és a #center2 a(:hover) img-t átalakítom #center2 a(:hover)-szerűvé akkor nem látszódik az ENTER háttérkép, és nem tudsz továbbmenni sehova.
Az átlátszó gif-nek az a funkciója, hogy legyen mire rákattintani, illetve azok számára, akik kikapcsolják a képek megjelenítését (vagy szöveges böngészőt használnak) látható navigációs elemet nyújtsunk. -
#3485 Hmm, azt hiszem, kezdem érteni. Szóval a háttérre van ráírva (és a te megoldásodban ki van hagyva a rollover effektus). De akkor már érvelhetünk úgy is, hogy az nem prezentációs elem, hanem funkciója van, így nem háttérképnek kellene lennie, hanem sima img-nek, és akkor tök fölösleges az az átlátszó gif... -
#3484 Ha látja akkor kattingatni fog a képen. (Tényleg, lehetett volna imagemap technikát alkalmazni...)
Ha nem látja (vak, vagy gyengénlátó)/szöveges böngészőt (Lynx,Links) használ, akkor az img tag alt attribútuma segít (de a Flash valószínűleg nem lesz olyan vakbarát...). -
#3483 Jó, de honnan fogja a látogató tudni, hogy éppen pont ott lehet belépni? Ha mondjuk csak a kurzor változik meg, az is egy elég mistery meat-es megoldás, és így kerülendő, nem? -
#3482 ez lett belőle:
klikk -
#3481 Furcsa, nálam (Firefox 1.5) működik.
A null.gif nálam így néz ki:
-
#3480 megvan!! nagyon köszönöm -
#3479 létrehoztam egy átlátszó gifet de ugy nem jó. megnézem amit most írtál. -
#3478 Azért van az alt attribútum beírva, mert az img tag kötelező része.
A title nem.
Az átlátszó gif azért kell, hogy látszódjon a háttér. -
#3477 Na de még ha létre is hozza, hol fog látszani az a felirat? Úgy gondoltad, hogy az alt text jelenjen meg tooltip-ként, amikor fölé megy egérrel? Mert az nem fog menni Firefoxban, az csak a title-t jeleníti meg így, az alt-ot a szabványnak megfelelően csak akkor mutatja, ha maga a kép nem elérhető. -
#3476 "a piros belépés felirat az a null.gif miatt eltünt és mot ott semi nincs"
A null.gif egy 258*33 méretű teljesen átlátszó gif kép. Szóval létre kell hozni egyet.
Vagy módosítsd következőképp a HTML kódot:
<div id="center2">
<a href="main.htm">
<div></div>
</a>
</div>
Akkor a CSS-kód a következőképp módosul:
#center2 a div {
cursor: pointer;
background: url("fullflash_04.jpg") center top no-repeat;
width: 258px;
height: 33px;
margin: 0px;
padding: 0px;
border: none;
}
#center2 a:hover div {
cursor: pointer;
background: url("rollover_04_04.jpg") center top no-repeat;
width: 258px;
height: 33px;
margin: 0px;
padding: 0px;
border: none;
} -
#3475 ez már középen van köszi!
egyedüül az a gond, hogy a piros belépés felirat az a null.gif miatt eltünt és mot ott semi nincs:( -
#3474 Táblázat használata nélkűl, valid kóddal, középre pozicionálva a HTML-kód:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Indexoldal</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="container">
<div id="row1">
<div id="leftcell"></div>
<div id="centercell">
<div id="center1"></div>
<div id="center2">
<a href="main.htm"><img src="null.gif" alt="Belépés" width="258" height="33" border="0" /></a>
</div>
</div>
<div id="rightcell"></div>
</div>
<div id="row2"></div>
</div>
</body>
</html>
A null.gif egy 258*33 méretű teljesen átlátszó gif kép.
A HTML kódhoz tartozó CSS kód (style.css):
body {
background-color: #ffffff;
color: #000000;
margin: 0px;
padding: 0px;
text-align: center;
}
#container {
position: absolute;
background-color: #ffffff;
color: #000000;
width: 772px;
height: 431px;
top: 50%;
left: 50%;
margin: -215px auto auto -386px;
padding: 0px;
border: none;
vertical-align: middle;
text-align: left;
}
#row1 {
width: 772px;
height: 324px;
margin: 0px;
padding: 0px;
border: none;
}
#leftcell {
background: url("fullflash_01.jpg") center top no-repeat;
width: 257px;
height: 324px;
margin: 0px;
padding: 0px;
border: none;
float: left;
}
#centercell {
width: 258px;
height: 324px;
margin: 0px;
padding: 0px;
border: none;
float: left;
}
#center1 {
background: url("fullflash_02.jpg") center top no-repeat;
width: 258px;
height: 291px;
margin: 0px;
padding: 0px;
border: none;
}
#center2 a img {
background: url("fullflash_04.jpg") center top no-repeat;
width: 258px;
height: 33px;
margin: 0px;
padding: 0px;
border: none;
}
#center2 a:hover img {
background: url("rollover_04_04.jpg") center top no-repeat;
width: 258px;
height: 33px;
margin: 0px;
padding: 0px;
border: none;
}
#rightcell {
background: url("fullflash_03.jpg") center top no-repeat;
width: 257px;
height: 324px;
margin: 0px;
padding: 0px;
border: none;
float: left;
}
#row2 {
background: url("fullflash_05.jpg") center top no-repeat;
width: 772px;
height: 107px;
margin: 0px;
padding: 0px;
border: none;
} -
#3473 nem, nem kell annyira nem fontos.
egyébként ehhez kell:
http://kurucz.try.hu //öcsémnek -
#3472 Validitás ellenörzése:
* (X)HTML/WAP
* CSS
* RSS/Atom
* Section 508/WCAG
* Paramédia
Ajánlom még figyelmetekbe:
* Akadálymentes weboldalak
* Weblapok ergonómiája
* Irányelvek webfejlesztőknek
* Jakob Nielsen: Web-Design
* World Wide Web Consortium - a(z) (X)HTML, CSS, és egyéb szabványok lelőhelye. -
#3471 mit nyertem?
tudom, hogy rájöhetek, hogy hol a hiba és csináljam meg FF alá is :) -
#3470 találat:) -
#3469 fogadjunk hogy FF-t használsz! -
#3468 valóban viszont most meg horizontálisan nincs középen, és a rollover image nem megy -
stormnet #3467 ponsosan... esetleg valaki tudna ajánlani valamit amibol (meg)lehet tanulni Faustus 3. pontjában szereplo komplikáltnak titulált dolgokról (valid, böngészőfüggetlen) ? mert en igy magát a nyelvet (html, css php stb.) értegetem, de konkrét ilyen húzások érdekelnének amivel ezeket el lehet érni (valid, böngészőfüggetlen)
thx -
#3466 "Szerintem a legegyszerűbb programozási nyelv, már ha lehet annak nevezni."
Nem az. HyperText Markup Language - hiperszöveg leíró nyelv.
Programozási nyelvek: Logo, (Visual) Basic, (Visual) C(++), C#, Pascal, Delphi, Java, Fortran, Assembly,...
Szkriptnyelvek (majdnem programozási nyelvek, de mégsem azok): PHP, ASP, Javascript, Perl (CGI), VBS,...
"a HTML oldalak már legalább 3-4 éve elavultak"
1. A mai trend az, hogy az oldal tartalmát, és az oldal design-ját különszedjék. Az előbbihez ott az (X)HTML, az utóbbihoz ott a CSS. Sőt valószínűleg hosszabb távon az oldal tartalmát, az oldal struktúráját, az oldal design-ját szét fogják szedni. Erre lesz majd az XML+XSLT+CSS megoldás.
Remélhetőleg a cégvezetők rájönnek, hogy a céges weblapoknál igen fontos az ergonómikus (felhasználók számára könnyen böngészhető, vakok/süketek/bénák számára is élvezhető), jól kialakított, valid oldal. Ugyanis ez is trend.
2. A statikus oldalak azért avultak el, mert a felhasználók egyre jobban elvárják a sűrűn frissűlő tartalmat.
3. A HTML nyelv könnyen megtanulható. Ami komplikált, az a valid, böngészőfüggetlen (amit a CSS és a Javascript kissé megnehezít), ergonómikus weboldal kialakítása. -
#3465 jajj, de ércs férre, csak azon "hihi"-ztem, hogy én azon az oldalon adtam be a HTML beadandómat.. :) -
#3464 Még az oldal neve is: "weblapszerkesztés kezdőknek"
Amúgy meg ez a HTML nyelv tök egyszerű dolog, két éve, egy unalmas hétvégén megtanultam az egészet. Ennyi. Szerintem a legegyszerűbb programozási nyelv, már ha lehet annak nevezni. De manapság HTML-el az ember már semmire se megy, azonkívül minimum javascript és php kell, mert a HTML oldalak már legalább 3-4 éve elavultak. -
#3463 lol -
#3462 Szerintem egyszerűen meg lehet tanulni innen. Én még annó könyvből tanultam, asszem a 'Weblapszerkesztés házilag' c. /bbs könyvkiadó/ könyvből. -
#3461 nédd csak meg, hogy mennyire középen van az!!!!!
itt -
#3460 de hát, nincs benne -
#3459 beleírtam, akkor is beleírtam de nem rakta középre! -
#3458 ja és, ne zippelve tegyél fel tárhelyre weboldalt, csak simán másold fel a fájlokat -
#3457 na, ez eddig jó, de írd bele, amit modntam
#3444 -as komment, ami zölddel van -
#3456 http://stopthebees.uw.hu/html.zip -
#3455 de egyébként nem bonyolult:
Csinálsz egy "nagy" táblázatot, amibe a teljes tartalom bekerül. Ennek mindössze 1 sora és 1 cellája legyen. Ebbe a cellába berakod a másik táblázatot úgy, hogy valahogy így nézzen ki: <td valign="middle"><table><tr>....és így tovább.
és ezt az egészet (tehát a "nagy" táblázatot) vagy a <center></center>, vagy a <div align="center"></div> módszerrel vízszintesen is középre rakod. Ennek működnie kell. -
#3454 ez miez? "http://stopthebees.uw.hu/oldal.zip"
egyébként nálam is működik, amit Cattie-Brie csinált -
#3453 ez mi ez a zip? -
#3452 akkor valamit nagyon elcsúnyázol, mert megicsnáltam és nálam középen-középen van minden -
#3451 ugyanaz nem müxik:(
viszont már jó az uw:
http://stopthebees.uw.hu/oldal.zip -
#3450 oké -
#3449 de -
#3448 Azt értem, de attól még maga a táblázat nem lesz középen...