--->>> PORTALGURU <<<---


Főoldal
Vendégkönyv
Fórum
Blog 
Itt hirdess!!!
Bannereim
Frissítések 
Díjaim 


Hogyan ???
Vezérlő menü
HTML tanfolyam
Kódok 
Kódpróba
Újdonságok a Gp-n
Pánik


Design szettek
780 pixeles szettek
Glitteres szettek
CSS kódok
Fejlécek 
Hátterek (1131 db)
Menük 
Hirdető dobozok
Naptárak
Naptáras órák
Avatarok  (270 db)
GIF-ek (138 db)
Glitterek
Átlátszó képek (451 db)
PSP brush 
PSP mask 
PSP Textures 
Modulhátterek
Képes keretek I.
Képes keretek II.
Glitteres keretek
Csipkés keretek
Átlátszó keretek
Oldalhátterekhez keretek


Stílusok
Új stílusok 
Színkódok nevei
Színkód generátor
Hasznos linkek 

Letöltések 

Elkészült rendelések 

Kedvcsináló 

 

 

Fantától kaptam, köszönöm!!!


Kedvenc oldalam

Fantától

 

           

Eddig 15 sablonhoz készült webszett!

Eddig 126 db 780 pixeles webszett!

Eddig
32 db extra szett!

2009.10.23.
Új menüpont a Kellékeknél:
PSP Textures!

114 db új kép
Használat leírásával!



2009.10.10.
  8 db új design szett
Ezek csak az EXTRA-s
oldalamon láthatók

http://semilin.extra.hu

 

  Ha kérdésed van, írj a FÓRUM-ba!

 
Gyere máskor is!
 
semilin

 

 

 

 

 

           

     

     

SMS hirdetőfal - Megéri!
 
Belépés
Felhasználónév:

Jelszó:
SúgóSúgó
Regisztráció
Elfelejtettem a jelszót
 
Hírlevél! Iratkozz fel!
E-mail cím:

Feliratkozás
Leiratkozás
SúgóSúgó
 
Látogatottság
Indulás: 2007-07-04
 
Szavazás
Lezárt szavazások
 

 


 

Page Ranking Tool

 

PageRank Kereső optimalizálás


 

 

 

Az oldal elköltözött, frissítések itt már nem lesznek!!! Gyere az új helyre: http://webdesign-graphic.hu Klikk!!!

HTML tanfolyam
HTML tanfolyam : 6. lecke - Képkezelés

6. lecke - Képkezelés

  2008.01.25. 21:37


6. lecke

Kép beillesztése

Van már tehát keretes hátterünk (táblázat) és tudunk írni is bele. Tegyük kicsit változatosabbá az oldalunkat képek beillesztésével. Válassz ki egy képet, amit fel szeretnél tenni. Ha eddig a saját gépeden egy külön könyvtárban dolgoztál, akkor célszerű a kiválasztott képet is abba a könyvtárba másolni. Természetesen a netről is választhatsz képet, akkor a kép URL címére lesz szükséged. Ha nem tudod, hogyan kell megtudni egy kép URL címét, olvasd el a "Kép beillesztése" cikk elejét!

Néhány szó a képfájlok kiterjesztéséről (fájlnév "." utáni része)

*.JPG, *.JPEG  - sima képfájl, ezt használjuk leggyakrabban, mert viszonylag kis helyet foglal

*.PNG             - ez is képfájl, akkor használjuk, ha tovább dolgozunk a képpel, átlátszó háttér

*.BMP            - bitmap kép, óriási helyet foglal érdemes JPG-re konvertálni

*.GIF                - "mozgó", animált képfájlok

Ennél sokkal többféle képfájl van, de ezek a leggyakoribbak.

Én most ezt a képet szeretném feltenni, a neve "Animation24.gif"

 Szép napot!

Akkor most lássuk a parancsot:

A kékkel jelölt szavak a kulcsszavak, melyek a kép tulajdonságait határozzák meg. Ha nincs szükség az adott tulajdonságra, egyszerűen elhagyható. Nézzük sorjában:

border                       - szegély vastagsága pixelben
src="....kép neve..." - a kép neve vagy URL címe (http://....)
width="..."               - a kép szélessége pixelben
height="...            - a kép magassága
alt="...szöveg..."       - ha a kép fölé viszed az egeret, ez a szöveg jelenik meg (próbád ki)
style="....."              - szegély tulajdonságai
          border:2 px     - szegély vastagsága (pl.2 pixel)
          #FF0000         - szegély színe (színkód)
          dotted              - szegély stílusa (pontozott vonal)

Ugyanaz a kép szaggatott vonal-lal szegélyezve, a pirossal írt tulajdonság változik: dashed

 Szép napot!

Ugyanaz a kép dupla vonal-lal szegélyezve, a pirossal írt tulajdonság változik: double

 Szép napot!

Ugyanaz a kép bevágott vonal-lal szegélyezve, a pirossal írt tulajdonság változik: groove

Szép napot!

Ugyanaz a kép kiálló vonal-lal szegélyezve, a pirossal írt tulajdonság változik: ridge

Szép napot!

Ugyanaz a kép bemélyített vonal-lal szegélyezve, a pirossal írt tulajdonság változik: inset

Szép napot!

Ugyanaz a kép kidomborodó vonal-lal szegélyezve, a pirossal írt tulajdonság változik: outset

Szép napot!

Mint látod, sokféle szegélystílust megadhatsz:)) Erre a részre még visszatérünk a stílusoknál!

Tarts ki, már majdnem végeztünk ezzel a leckével:)))

Már csak igazítani kell a képet az előző leckéből megismert "align" paraméter segítségével.
Az alábbi kódokat próbálgasd a kódpróba ablakban (a kép neve helyére a sajátodat írd):

  Balra : align="left"

Szép napot!    Balra igazítva

 

Középre: align="center"

Szép napot! Középre

 

 Jobbra: align="right"

Jobbra igazítvaSzép napot!


Jól látszik, hogy a <p>....</p> parancsba ágyaztuk be az <img ....> parancsot!

Itt próbálgathatod:

 


A következő leckében a link-kezelésről lesz szó.... ugye várod? :))))

 Egy klikkelés és már nyomatódik az oldal


 

Sztárok/Bulvár: Tudj meg friss pletykákat, híreket. Katt!    *****    Outsider - Gay - Creative - Rebel - Tolerant - Furry - Brony - Hipster - Gamer - Otherkin - Geek - Autistic    *****    Xtina Hungary - Minden, ami Christina Aguilera!    *****    Légy Te is AVON tanácsadó *** Nyereményjátékok *** Kereseti lehetõség *** Vásárolj kedvezményesen AVON termékeket!    *****    Nyerj ajándékszettet! Töltsd ki a kérdõívet és nyerj! *** Nyerj ajándékszettet! Töltsd ki a kérdõívet és nyerj!    *****    Jófogás Játékvásár - Jófogás Játékvásár - Jófogás Játékvásár - Jófogás Játékvásár     *****    FRPG &#9679; FANTASY SZEREPJÁTÉK &#9679;&#12300;&#914;&#923;SM&#923;IW&#12301; &#9679; FANTASY SZEREPJÁTÉK &#9679; EGY SZIGET + 24 MÁGUS &#9679; FANTASY SZEREPJÁT&Eacut    *****    Itt megtalálhatod a legfrissebb híreket, cikkeket, képeket a Golden Globe- és Oscar-díjas színésznõrõl! Katt!    *****    Furry Fandom - Antropomorf Állatok - Furry Fandom - Antropomorf Állatok - Furry Fandom - Antropomorf Állatok    *****    Légy Te is AVON tanácsadó *** AVON termékek *** Kereseti lehetõség *** Értékesítõ kollégákat keresek *** sminkek    *****    Esküvõi meghívók! Mindegyik kézzel készült, egyedi. Gyere, nézd meg az oldalamat.    *****    A legfrissebb Anime hírek , mindennap anime ajánló , mondocon képek , és hírek. Csatlakozz közösségünkhöz!    *****    Rendelj bármilyen asztrológiai elemzést,júniusban Te mondod meg,hogy mennyit szeretnél érte fizetni!Várlak az oldalamon!    *****    Egyetemistáknak kiemelt lakások eladóak. www.simonyiingatlan.hu Debrecen eladó kiváló lakások. www.simonyiingatlan.hu    *****    Egyetemistáknak kiemelt lakások eladóak. www.simonyiingatlan.hu Debrecen eladó kiváló lakások. www.simonyiingatlan.hu    *****    NÁLAM NINCSENNEK AKCIÓK, MINDEN ASZTROLÓGIAI ELEMZÉS "BECSÜLET KASSZÁS", A KONZULTÁCIÓ ÉS OKTATÁS INGYENES.    *****    **** Nokedli-lapja****Családi magazin****18-98 éves korosztály mindent megtalál itt, játékoktól a hírekig*****    *****    KÜLÖNLEGES AKCIÓ A CSILLAGJÖVÕ OLDALON JÚNIUSBAN.TE DÖNTHETED EL MENNYIBE KERÜLJÖN A HOROSZKÓP MEGRENDELÉSEID ÁRA!    *****    Minden héten anime/managa hírek , minden nap Anime ajánlók , Mondocon hírek. Itt nem fogsz unatkozni!! :)    *****    KÜLÖNLEGES CSILLAGJÖVÕ AKCIÓ JÚNIUSBAN.TE DÖNTHETED EL MENNYIBE KERÜLJÖN A SZÜLETÉSI HOROSZKÓP! VÁRLAK!RENDELD MEG MOST!