Kezdőoldal » Számítástechnika » Weblapkészítés » Mi a problema a HTML oldalammal?

Mi a problema a HTML oldalammal?

Figyelt kérdés

Sziasztok!

Egy HTML oldalon dolgozok, de van egy kis problemam...

Az oldalamnak összesen 6 buttonja van (egymas mellett vannak) es a buttonok ala szeretnek egy kepet es egy szöveget beilleszteni, de a problema a következö:

Ha valamit beillesztek ala es raklikkelek pl. a beillesztett kepre, akkor a button1 oldalat nyitja meg, olyan mintha egy button lenne az amit beillesztek ala.

Itt van a kod:

<HTML>

<HEAD>

<TITLE>Valentin Villarmé</TITLE>

<body>

</CENTER>

</body>

</HEAD>

<body>

<CENTER>Herzlich wilkommen auf der Seite von der Familie Villarmé!</CENTER>

</body>

Köszönöm a segitseget!

2014. ápr. 16. 08:31

1/7 anonim

válasza:

Több sebből vérzik.

A képek linkelésénél ne abszolút hivatkozásokat használj (D meghajtó X könyvtára), hanem relatívakat, és ne bmp-t, hanem valamilyen tömörített webes képformátumot: png, jpg, gif.

Relatív hivatkozás a következő: kepek/kep.jpg -> ekkor a kép a kepek nevű mappában van, ami pedig ugyanabban a mappában van, mint a html fájl. Ekkor ha átmozgatod az egész könyvtárat, amely a webes projektedet tartalmazza, a hivatkozások továbbra is működni fognak. Ha viszont így hagyod, majd feltöltöd a webre, és ott a D meghajtón keresi a képet, nem fogja megtalálni.

És akkor a probléma:

"<a href="Biographie.html"><img height="50" width="150" src="D:\ProjektePriv\HTML Projekt 1\Taste Huiles.bmp" alt="ButtonHuiles" </a> "

Nincs lezárva az img tag. Így helyes a kód (hivatkozásoknál a nagybetűk és a szóközök is kerülendőek):

"<a href="biographie.html"><img height="50" width="150" src="taste-huiles.png" alt="ButtonHuiles" /></a>"

A képet át kellene konvertálnod pl. png-be, és beletenni a html mappájába (mint a fenti példában), vagy létrehozni abban egy kepek (vagy images) mappát, és akkor úgy hivatkozni rá, hogy "kepek/taste-huiles.png" vagy "images/taste-huiles.png)".

Természetesen a kép neve pontosan az legyen, ahogy hivatkozol rá: taste-huiles.png

2014. ápr. 16. 08:48

Hasznos számodra ez a válasz?

2/7 anonim

válasza:

AZ a probléma vele, hogy már 10 éve is elavult volt, nem még ma. :)

2014. ápr. 16. 14:08

Hasznos számodra ez a válasz?

3/7 2xSü

válasza:

Vegyük ki az összes elemet, csak a html, body és head tag-ek maradjanak. Hogy néz ki így az oldalad?

<HTML>

<HEAD>

<body>

</body>

</HEAD>

<body>

</body>

Remek… Akkor HTML 1. lecke: Kétféle tag létezik. Vannak, amelyeknek nincs záró tag-jük. Ilyen például egy kép, ami egy önálló elem, nem fog közre semmit. (Pl. <img …>, ) Vannak, amelyeknek van záró tag-jük, ezek azok, amelyek közrefognak más elemeket. (Pl.: félkövér, vagy <a …>link</a>).

A tag-eket a megnyitás sorrendjében kell lezárni.

Helyes: félkövér és dőlt

Helytelen: félkövér és dölt

Minden HTML dokumentum így néz ki:

<!doctype … >

<html>

<head>

</head>

<body>

</body>

</html>

A doctype megmonja, hogy milyen nyelvjárásban kérszült az adott HTML oldal. HTML 3.2-ben? HTML 4.01 transitional-ban? HTML 4.01 strictben? HTML 5-ben?

Ezután jön a HTML rész, ami két részből áll, a fejlécből és a testből. A fejlécbe kerül minden olyan jellegű információ, ami nem konkrétan a böngésző keretén belül jelenik meg, vagy alapvetően nem megjelenítendő elem, hanem egyéb információt tartalmaz a dokumentumról. Ilyen példálul a böngésző címsorában megjelenítendő cím, hogy milyen karakterkódolással kell értelmezni a dokumentumot, hogy meddig tárolható a böngésző cache-ében, mielőtt újra le kell tölteni a szerverről, hogy milyen keresőkulcsszavakhoz rendelje hozzá a kereső, stb… A body-ba kerül minden ténylegesen megjelenítendő elem.

Szóval valahogy ez a különbség egy normális HTML dokumentum és a te kódod között:

http://kepfeltoltes.hu/view/140417/html_www.kepfeltoltes.hu_.jpg

A többi tag-ről ne is beszéljünk. Szegény <html> tag-et elhagyta a párja. De lehet azzal vigasztalni, hogy nem csak ő járt így, például szegény <blockquote> is magányosan tengeti az életét.

2014. ápr. 17. 09:55

Hasznos számodra ez a válasz?

4/7 anonim

válasza:

#3: Vicces lett a képed, jót nevettem :D

2014. ápr. 17. 10:00

Hasznos számodra ez a válasz?

5/7 2xSü

válasza:

A másik hatalmas hibát már leírták előttem, de azért leírom én is.

Kétfajta módon lehet URL-t megadni, relatív és abszolút hivatkozással. A relatív hivatkozás esetén az útvonal a html fájlhoz képest történik meghatározásra (hacsak a <base> tagel nem adunk meg mást hivatkozási kiindulópontot). Az abszolút hivatkozás meg attól függetlenül adja meg a kép, link helyét, hogy az adott html fájl hol található. Az abszolút hivatkozás mindig protokoll leírással kell, hogy kezdődjön.

Tegyük fel van egy www.honlapom.hu honlapod. Létrehozol egy HTML dokumentumot, ami a http://www.honlapom.hu/teszt/index.html URL-el érhető el.

Ekkor:

A kép ebben az esetben a http://www.honlapom.hu/teszt/kep.jpg fájlra mutat.

A kép ebben az esetben a http://www.honlapom.hu/teszt/kepek/kep.jpg fájlra mutat.

A kép ebben az esetben a http://www.honlapom.hu/kep.jpg fájlra mutat. (Az URL elején lévő / jel utal arra, hogy a honlap gyökérkönyvtárához képest relatív a hivatkozás, azaz nem a teszt „mappában” fogja keresni a képet.)

A kép ebben az esetben a http://www.honlapom.hu/kepek/kep.jpg fájlra mutat.

Most jöjjön az abszolút hivatkozás:

A kép ebben az esetben a http://www.masikhonlap.hu/kepek/kep.jpg fájlra mutat. Látható, hogy az abszolút URL a protokollal kezdődik.

(Van még további eset, de egyelőre elégedjünk meg ennyivel.)

Tipikus hibák:

Mivel nem protokollal kezdődik az URL, ezért az relatív hivatkozásnak fogja tekinteni a böngésző, így ez az URL a http://www.honlapom.hu/teszt/www.honlapom.hu/kep.jpg fájlra fog mutatni. (Ugye mappa nevében nyugodtan lehet pont, tehát létezhet ilyen útvonal.)

Ez egy fájlra mutat. Bárhol is jelenik meg a fájl, az adott gép C: meghajtójának megfelelő útvonalán fogja keresni a fájlt. Te megnézed a te gépeden, és mindent rendben találsz, hiszen nálad van C: meghajtó, azon belül van munka mappa, azon belül honlapom mappa, és abban ott van a kep.jpg. De amint Pistike nézi meg a honlapod, úgy már az ő böngészője próbálja értelmezni az útvonalat. Nála van C: meghajtó, viszont mondjuk abban nincs munka nevű mappa, így aztán a böngésző nem is tudja betölteni a képet, hiszen az nincs ott…

~ ~ ~ ~ ~ ~ ~

Milyen URL-t adtál meg te? Pl:

Ha ezt feltöltöd egy szerverre, hol fogja keresni a fájlt? Mivel nincs protokoll megadva, relatív hivatkozásként próbálja értelmezni:

http://www.honlapom.hu/teszt/D:\ProjektePriv\HTML Projekt 1\Valentin Villarmé Titel.bmp

2014. ápr. 17. 10:19

Hasznos számodra ez a válasz?

6/7 2xSü

válasza:

Aztán ugye URL-ben nem lehet szóköz, meg jópár más karakter sem, pl / karakter sem, ? karakter sem. Ha mondjuk egy fájlnévben van szóköz, azt az URL-ben máshogy kell jelezni.

Pl. a "Taste Biographie.bmp" fájl esetén az URL így néz ki: "Taste%20Biographie.bmp". Itt a % karakter jelzi, hogy valami speciális karakterről van szó, a % utáni két karaktert hexadecimális számként kell értelmezni, és az ennek megfelelő karakterrel helyettesíteni. A szóköz ASCII kódja 32. Ez hexadecimális számrendszerben 20. Így jelöli a %20 a szóköz karaktert, vagy a %3F a 63. karaktert az ASCII táblában, ami a ? jelnek felel meg. Lásd: [link]

~ ~ ~ ~ ~ ~ ~

Arra meg az előző válaszoló kitért, hogy a BMP eléggé Windows specifikus fájlformátum. Oké, a legtöbb böngésző ismeri, a fő gond inkább azzal van, hogy a BMP formátum nem igazán tömörít. Nagyon nagy fájlok lesznek így a honlapodon, lassan tölti le, feleslegesen terheli a sávszélességet, pazarolja a tárhely méretét.

Általában ajánlott a következő formátumok használata:

GIF:

Előny: Lehet vele veszteségmentesen tömöríteni, ha a kép nem tartalmaz sok színt. (Pl. fekete-fehér kép, vektoros rajz, dizájn elem). Továbbá támogatja az animációt. Támogatja az átlátszó pixeleket is.

Hátrány: Maximálisan 256 színt tud kezelni. Pl. egy sok színt tartalmazó fénykép tömörítésére nem igazán alkalmas.

JPG (JPEG):

Előny: Nagyon jól tömörít fénykép jellegű képeket.

Hátrány: Veszteséges tömörítést alkalmaz. A közel veszteségmentes eredmény elég nagy fájlméretet tud produkálni. Vektoros rajz, szöveg tömörítésére lehet, hogy nem a legjobb választás. Nem támogatja az átlátszóságot, se az animációt.

PNG:

Előny: Jó tömörítési hatásfok, veszteségmentes tömörítés, támogatja az átlátszóságot és az áttetszőséget is, azaz lehet félig átlátszó eleme is a képnek.

Hátrány: Nagyobb fénykép esetén lehet, hogy nagyobb a fájlméret, hiszen veszteségmentesen tömörít. (Fénykép esetén ha egy pixel nem pontosan olyan színű, mint az eredeti képen, akkor az nem gond.). Nem támogatja az animációt. (Bár van animációt támogató formátuma is, például az APNG, a Firefoxon kívül nem nagyon ismeri más böngésző.)

2014. ápr. 17. 10:41

Hasznos számodra ez a válasz?

7/7 A kérdező kommentje:

Szuper válaszok!!!

Nagyon köszönöm a válaszokat,mindenkinek megy a zöld kéz.

2014. ápr. 19. 11:46

Kapcsolódó kérdések:

Létrehoztam egy html honlapot, melyik a legjobb INGYENES tárhely és domain?

Nagyon kezdő vagyok a HTML kódolásban, hogy hogyan mozgathatok egy képet pontosan középre?

Az lenne a gondom hogy egy egyszerű honlapot csináltam html-ben és nem tudom hogy csináljam meg ezt?

Kapcsolatfelvételi űrlapot készítés, hogyan?

WYSIWYG űrlap készítés hiba segítene valaki?

EZT HOGY CSINÁLTÁK? FONTOS (többi lent)

Számítástechnika főkategória kérdései »

Számítástechnika - Weblapkészítés kategória kérdései »

A weboldalon megjelenő anyagok nem minősülnek szerkesztői tartalomnak, előzetes ellenőrzésen nem esnek át, az üzemeltető véleményét nem tükrözik.
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!