Hogyan készítsünk egy weboldalt, 2. részt, teljesen 0-ból készített oldalt HTML-ben, CSS-ben képgalériával - oktatóvideó

Ez az útmutató leírja a weboldal segítségével HTML és CSS, amely minden szakaszában: létre a helyén,
A regisztráció egy ingyenes tárhely, és végül feltölteni fájlokat a website hosting, ingyenes tárhely egy gyors módja annak, hogy néhány perc alatt az online website, a kellemetlenségért ennek a módszernek, hogy mi lesz néhány hirdetések jelennek meg az egész a felső (a fejléc tetején).

Aki azt akarja, hogy nyissa meg a honlapon, meg kell tudni, hogy a HTML és a CSS, akkor nem szükséges, hogy egy szakértő HTML (Hyper Text MArkupe Language), de néhány kódinformáció elengedhetetlen ahhoz, hogy megértsük ezeknek a dolgoknak a működését.

Még ha épít egy oldalon, csak annyit kell tudni, hogy mi megy keresztül ezeket a fájlokat, akkor kell időszakos hibák javításával és megvalósítása változás.

Sokan elmenekülnek a kódtól, sokan hasonlítják a kódot a hieroglifákhoz, ez egyáltalán nem így van, valaki egyszer mondta: "A KÓD KÖRÖLÉSE", igaza volt, amikor látja, hogy valami kódsorból származik, csodálatosnak érzed magad, építesz egy virtuális világ csak billentyűzettel és egérrel.

Régóta használtuk a szoftvercégek által készített alkalmazásokat, csak számítógépes műveleteket végeztünk, ideje programozni, valójában nem programozási nyelv, hanem "jelölőnyelv", de utalni fogunk olyan, mint egy programozási nyelv, mert nagyon furcsa "jelölőnyelvnek" hangzik, a HTML az egyik legkönnyebb programozási nyelv (jelölés), amelyet manapság használnak, HTML-t látunk bármelyik oldalon, sok szoftver rendelkezik ők a HTML alkotóelemei, ez a programozási nyelv mindenütt megtalálható, ideje megtanulni.

Az első alkalommal, lehet egy kicsit ijesztő, de ha kevésbé óvatos, meg fogod érteni, hogy azonnal minden olyan nehéz, a dolgok egyszerű és szép, hozunk létre valamit a kezünkben, ez a legfontosabb dolog.

Megtanítjuk az alapokat, akkor megtanulják, hogyan kell szöveget egy weboldalt, akkor mi szívesen segítünk, és a szöveg színét, használjuk a CSS stílust oldal (Cascading Style Sheets), amely segítségével helyezi mind oldalelemek HTML egyáltalán, így lesz hely az oldalunkon, hogy néz ki, hogy az egy darabból.

Most megtudhatod, egyszerű technikákat, az alapvető HTML és CSS, bár ezek az alapvető dolgok, HTML és CSS, hozzon létre egy szép áttekintést.

Mert ez a bemutató gondosan felfegyverkezve türelemmel, ez a bemutató az egyik, hogy engedheti meg magának, hogy készítsen kevés, ha hátra néhány másodperc lehet, hiányzik valami nagyon fontos, és látni fogja, ezt követően nem lép hatályba, a koncentráció Az információ rendkívül magas, és ezért kérem, hogy nagyon, nagyon óvatos.

Ezután ez a bemutató, azt mondanám, még intenzív kurzus, akkor van egy jobb ötletem, hogy mi az a HTML és a CSS, akkor az ellenőrzés a kódot is, hogy megértsük egy HTML dokumentum HTML érzés, hogy nem csak egy sor heroglife fogják oszlatni, tudod, mi ez, ha megnézzük egy dokumentumot vagy egy HTML CSS.

Megtanuljuk a címkéket (címkék), itt van néhány példa a tag-ek (címkék), amelyek segítségével a HTML dokumentumban, ne aggódj, nem kell tárolni őket, csak meg kell tanulni az alapokat az első táblázat a többi itt található az oldalon, vagy az interneten, amikor szükség van rájuk.

Még a táblák sorrendben ezek a címkék, készülnek HTML.

Alapvető elemek (címkék).

Adjon meg egy fájlformátum Web
Dokumentum fejlécében
Tilul dokumentum
A test a HTML-oldal
BGCOLOR = szín A háttér színe az oldal
TEXT =szín Color szöveges oldal
LINK =szín Nem látogatott hivatkozás színe az oldal
Vlink =szín Látogatott hivatkozás színe az oldal
ALINK =szín Link színe alatt kattintson exacutat felhasználó
HÁTTÉR = url Háttérkép az oldal
Bekezdés
<Hn> <Hn> Level felirat a dokumentum (n = 1-6)
Megadja a tulajdonságok a szöveg keretben
SIZE =n A szöveg mérete 1 7-
FACE ="A, b" Megadja a font: aHa rendelkezésre áll, vagy b
COLOR =s Szöveg színe: vagy a szín neve vagy RGB érték
Új sor
Information előre formázott
HTML Comenatriu
Material keresztezi az oldalt
Vízszintes vonalzó
SIZE =x Vonalzó magassága pixelben
Szélesség =x Vonalzó szélessége pixelben vagy százalékban
NOSHADE Kikapcsolása árnyék kijelző vízszintes vonalzó
Align =x Állítsa vízszintes vonalzó az oldalon (balra, középre, jobbra)
COLOR =x A szín a vízszintes vonalzó (csak IE)
Anchor jel
Href =url Hypertext Reference
Href =# Neve Hivatkozás belső horgony
Név =név Meghatározása belső horgonyok

Elements listák .

Leírás meghatározása
List típusdefiníció
Fogalom
Szolgáltatások listája
<OL Rendezett lista (számozott)
TYPE =típus Írja számozás. Lehetséges értékek: a, A, én, én, 1
START =x Rajtszámát a lista megrendelt
<UL Rendezetlen lista (ek)
TYPE =forma Formája a jelölés. Lehetséges értékek: kör, négyzet, korong.

Karakter formázási elemek .

Be a szöveget félkövér
Szöveg beszúrása dőlt betűvel
Kijelölt szöveg beillesztéséhez
Szöveg font Minivan
Idézet bibliogarfica
Program Listing
Stílus kiemelés logikai
Szöveget a billentyűzet
Kiemelés erős logika
Program vagy változó
<BASEFONT SIZE = n> Meghatározza az alapértelmezett betűméretet az oldal

Elemek keretek .

Meghatározása az írás oldalra
COLS =x A szám és relatív mérete az oszlopok
Sor =x A szám és relatív mérete a sorok
Border =x Megadja a „be” vagy „ki” állapotot a FRAMESET kerethez (1 vagy 0)
Frameborder = x Megadja a kocka méretét
Framespacing = x Az összeg a tér két szomszédos képkocka
A meghatározás egy bizonyos keret
SRC =url URL forráskódú keretrendszer
NAME =név Keret neve (a TARGET = névvel együtt használják a horgony jel részeként
Görgetés =SCRL Határozza meg az opció lehetséges derulare.Valori bar: on (engedélyezett), off (kikapcsolva), Auto (automatikus)
Frameborder =x Határ körül a kocka méretét
Marginheight =x Extra tér fölött és alatt egy bizonyos keretet
Marginwidth =x További egység helyet a bal és jobb oldalán az adott keret
§ megjelenített oldal a felhasználók, akik nem látják a keret
Belső váz (for (IE)
SRC =url Forrás keretrendszer
NAME =s Megnevezés ablak (hasznos TARGET)
MAGASSÁG =x Magassága beágyazott
Szélesség =x Beágyazott keret szélessége

Tételek táblák .

HTML táblázat
Border =x Box táblázat
Cellpadding =x További teret cellák
Cellspacing =x Extra közötti tér cellák
Szélesség =x Szélesség kiszabott táblázat
FRAME =érték Finombeállítása táblázat
SZABÁLYOK =érték Finombeállítása az asztal uralkodók
BorderColor = szín Megadja a határ színtáblázat
BORDERCOLORLIGHT = szín A világosabb szín a két szín meghatározott
BORDERCOLORDARK = szín A sötétebb színű a két szín meghatározott
Align =balra Állítsa az asztalt a bal oldalán, és a szöveg folyik jobb oldalon
Align =jobb Állítsa be a táblázat jobb oldalán, és a szöveg folyik balra
Hspace =x További egységnyi vízszintes helyet az asztal körül
Vspace =x További egységnyi vertikális hely körül asztal
COLS =x Megadja az oszlopok száma a tábla
Meghatározza az oszlopdefiníciók készletét a jelöléssel
<COL Szélesség =x> Adjon meg egy oszlop szélességét
Meghatározza a táblázat címe
Meghatározza a táblázat test
Vonal táblázat
BGCOLOR =szín Meghatározza a háttér színét az egész vonalon
Align =igazítás Állítsa sejtek az aktuális sor (balra, középre, jobbra)
A sejt a táblázat adatait
BGCOLOR =szín Meghatározza a háttér színét a cella adatok
Colspan =x Oszlopainak számát, amely átfogja az aktuális cella adatok
Rowspan =x Sorok száma az adatok átívelő aktuális cella
Align =igazítás Igazítása az anyagot a lehető date.Valori cella (bal, jobb, közép)
Valign =igazítás Függőleges igazítás a sejt anyag date.Valori lehetséges: (felső, alsó, közép)
HÁTTÉR =url Adja meg a háttérkép az asztali cella
Nincs tördelés Ne engedje, hogy szétválasztását sornyi szöveget cellán belül
Align =kiindulási Állítsa sejtek kiindulási adatokat szomszédos szöveg
Align =jellem Egy oszlopot igazít egy adott karakterhez (az alapértelmezett karakter ".")
Align =igazol Állítsa szélén a bal és a jobb szélén a szöveg

Új kép elemek.

<IMG Jelölés input képek
SRC =url A forrás képfájlt
ALT =szöveg Alternatív szöveg jelenjen meg, ha szükséges
Align =igazítás Igazítása az oldalon. Lehetséges értékek: top (felső), középső (középen), alsó (alul), balra (balra), jobbra (jobbra)
MAGASSÁG =x Kép magassága (pixelben)
Szélesség =x Kép szélessége
Border =x A keret a kép körül, amikor használják a hivatkozás
Hspace =x További vízszintes helyet a kép körül (pixel)
Vspace =x További függőleges tér a kép körül (pixel)

Elements formában.

HTML form aktív
ACTION =url CGI program a szerveren, hogy megkapja az adatokat,
MÓDSZER =módszer Milyen adatokat nyújtottak be a szerverre (GET vagy POST)
<INPUT Szöveges mező vagy más beviteli
TYPE =opció Beviteli mező típusa . Lehetséges értékek: szöveg, jelszó, jelölőnégyzet, rejtett, fájl,
rádió, be, vissza, a kép.
NAME =név A szimbolikus érték neve mezőben
VALUE =érték Alapértelmezett tartalmát a szövegmezőbe
CHECKED = opció Gomb / doboz jelölt Alapértelmezett
SIZE =x Karakterek száma a szövegmezőben
SIZE =x A maximális engedélyezett karakterek száma
Group jelölőnégyzetet
NAME =név A szimbolikus érték neve mezőben
SIZE =x A száma menüpontok jelennek egyszer (alap = 1)
TÖBB =x Kiválaszthatja több menü elem
<OPCIÓ Különleges választás egy mezőben
VALUE =érték A kapott értéket a beállításokat a menüben
Megerősítés Camp szöveg több sorban
NAME =név A szimbolikus érték neve mezőben
Sor =x Sorok száma a mezőbe
COLS =x Oszlopok száma (karakter) egy sor szövegdoboz
Megosztás formában logikai részek
Tartozó név készlet mezők (mezőkészlet)
Align =s Meghatározza az összehangolás a legenda (magyarázat) látható (felső, alsó, bal, jobb)
Tabindex =x Meghatározza az elemek sorrendjét, ha a felhasználó megnyomja a Tab billentyű
ACCESKEY =c Megadja, amely gyorsbillentyű a billentyűzeten egy adott elem
DISABLED Element inaktív, de nem jelenik meg a képernyőn
Olvasható Elem jelenik meg a képernyőn, de nem szerkeszthetők

Speciális elemek.

Részletes információk a modell stílus
TYPE =val A stílusmodell típusa. Általában "szöveg / css"
Általában tartalmaz egy Javascript script weboldal
LANGUAGE =nyelv A használt nyelv
EVENT =esemény Kiváltó esemény végrehajtása egyes szkriptek
FOR =numeobiect Objektum neve az oldalt, amelyen a script működik

Download Lista HTML

Ha szeretné, hogy nézd meg készült bemutató, elérhetjük ezt a címet: http://www.videotutorial.150m.com.

Javasoljuk, hogy bontsa ki a csatolt fájlt, és tanulmányozza a három html fájlokat, vagy a CSS fájlt a Notepad + +, vagy egy másik program szerkeszteni weboldalakat így lehet változtatni cau is, hogy jegyzeteket közben is meg fogja tanulni html nélkül számla.

Kívánok kellemes és üdvözöljük Önt a következő konzultáció ebben a sorozatban, és azon túl.

Fájlok letöltésére TEST

által végzett Dan Constantin
tutorialegimp.blogspot.com
Cristian Cismaru: Tetszik minden, ami az informatikával és technológiával kapcsolatos, szeretek megosztani a naponta felhalmozott tapasztalatokat és információkat. Megtanullak tanítani!

Megjegyzések megtekintése (333)

  • Nagyon szép, rengeteg információ a bemutató.
    Ez a leírás nevezhetjük: infúziós HTML és CSS.
    Lehet, hogy nem értem, hogy tanulni néhány hónap alatt meg lehet tanulni itt egy óra múlva, már láttam, hogy minden előtt is írt, és azt mondhatom, hogy mély benyomást tett rám idézet információ elfér a tutorial.
    Egy ponton úgy éreztem, hogy meg kell inni vizet, bár én csak néztem a bemutató, és nem akarok arra gondolni, idézet Dan ivott víz után.
    Van valami, nem tanulni a HTML és / vagy CSS után ez a bemutató.

  • Aoleu, amit körülbelül 3 hónapja próbáltam megtanulni, úgy tűnik, nincs időm ...
    Nagyon köszönöm, nézem el figyelmesen!

  • Cristi-adminNagyon szép, rengeteg információ a bemutató.
    Ez a leírás nevezhetjük: infúziós HTML és CSS.
    Lehet, hogy nem értem, hogy tanulni néhány hónap alatt meg lehet tanulni itt egy óra múlva, már láttam, hogy minden előtt is írt, és azt mondhatom, hogy mély benyomást tett rám idézet információ elfér a tutorial.
    Egy ponton úgy éreztem, hogy meg kell inni vizet, bár én csak néztem a bemutató, és nem akarok arra gondolni, idézet Dan ivott víz után.
    Van valami, nem tanulni a HTML és / vagy CSS után ez a bemutató.

    igen, igazad van, Cristi, de csalódott vagyok, mert azt hittem, hogy meg fogod csinálni az oktatóprogramot :( de egyébként a bravo dan nagyon jó bemutató

    • Nem szép, amit mondtál, és ezt őszintén mondom, ez az ember körülbelül másfél órát küzdött, hogy megtanítsa neked, hogyan kell webhelyet készíteni a semmiből, és azt mondod, hogy csalódott vagy, mert nem tette meg? El tudod képzelni, hogy mennyi munkát tett az ember és mennyi időt vesztett, hogy megtanítsa nekünk a html és a css alapjait, gondoljon mielőtt megnyitná a szája előtt, hogy nem lenne megfelelő a munka benyújtására, majd hagyjon meg más felesleges megjegyzéseket, csalódott vagy, hogy nem tette fel, valaki más készítette ezt az oktatóprogramot, köszönöm, hogy van, ahol meg lehet tanulni;)

  • csőr:
    igen, igazad van, de csalódott vagyok, mert úgy gondolja, Cristi megteszi tutorialu de amúgy nagyon jó dan bravo tutorialu

    Mit gondolsz, hogy a "Hogyan lehet webhelyet készíteni" sorozat véget ért?
    A következő bemutató leszek én.
    Mivel mi a következő bemutató Azt kell, hogy figyelte a bemutató által Dan.
    Amit jelenleg eltér a bemutató rájöttem aza Dan, de a benne foglalt információ lényeges lesz a megfelelő megértését a dolgok.
    Számos módja van, hogy tegye közzé a weboldal tartalmát, de van egy közös nevezője, HTML és CSS, anélkül, hogy őket, akkor nem csinál semmit.

  • Cristi-admin:
    Mit gondolsz, hogy véget ért a sorozat "Hogyan készítsünk egy honlapot."
    A következő bemutató leszek én.
    Mivel mi a következő bemutató Azt kell, hogy figyelte a bemutató által Dan.
    Amit jelenleg eltér a bemutató rájöttem aza Dan, de a benne foglalt információ lényeges lesz a megfelelő megértését a dolgok.
    Számos módja van, hogy tegye közzé a weboldal tartalmát, de van egy közös nevezője, HTML és CSS, anélkül, hogy őket, akkor nem csinál semmit.

    Szia Cristi, hibáztatom egy sor php vagy js?

  • Alex:
    Szia Cristi, hibáztatom egy sor php vagy js?

    Mi beszélni mindent, de a PHP és JS webhely kötődik HTML HTML nélkül nem.
    PHP használják inkább kivonására adatbázisokból, weboldalakat HTML, legyen az a dinamikus weboldalak (PHP, DHTML, ASP, JSP, cf) legyen egy statikus oldal, mi használni a HTML, nem ő nem tehet semmit.
    Sokan nagy hibát követnek el "" Már nem akarok HTML-webhelyet, dinamikus php-webhelyet akarok ", ez egy nagy hiba, a HTML-t szinte mindenhol használják, akár dinamikus, akár statikus webhelyekről beszélünk.
    JS (java script) nem azonos a JSP (Java Server Pages), amely attól függ, hogy a szerveren, JS oldalak használják bizonyos szkriptek, nincs szükség semmilyen szervert, JS szkriptek fut minden böngésző nélkül kiszolgáló komponens, és a bemutató, Dan használható egy sor szkriptek JS (fotógaléria) off dolgokat használ JS, vannak egész weboldalak JS inkább tele vannak helyek a Java Server Pages, ami valami mást, bár úgy tűnik, ugyanaz.
    Tudom, hogy már régen elkezdett tanulmányozni a "kódot", ez az útmutató kiváló segítség, Dan rendkívüli dolgot csinált ezzel az oktatóanyaggal, sőt még nem is tudod, mennyire értékes ez az oktatóprogram, az oktatóanyag alatt szinte minden címkével rendelkezik ) HTML formátumban használhatja őket, különösen mivel mindegyiknek van leírása.
    Ne hagyd, hogy ALEX, törni a kódot, ez alapján.
    Hidd el, hiányzik a potenciális NO!

  • sok nagyon jól felépített információt, hogy bárki megérthesse. Személyesen csak azért néztem meg az oktatóprogramot, hogy valami újat tudjunk meg, és az oktatóprogram előrehaladtával csodálkoztam, milyen könnyű lehet egy webhelyet létrehozni, nem is. töltött és nagyon kellemes nézni. Gratulálok ennek az oktatóanyagnak, de az összes többinak is. Várom, hogy a következő "infúzió" (cristi szavai) legyen információkkal.

  • ha ez egy bemutató Dreamweaver? Vagy ne használja a Dreamweaver dc a oktató?

    Gratulálunk minden oktatóhoz ... te vagy a legerősebb;)

  • Helló ... az oktatóprogram nagyon jó, nagyon sok információ van ... és azt hiszem, hogy a 98 'címoldalon el kellett tanulnom az alapvető html-t, tucatnyi teszt elvégzésével, ami a könyvtár könyveiből készült, mert még nem volt akkoriban net és most nézhetek meg egy oktatóanyagot, amely elmagyaráz mindent, amit tudnom kell .. egyértelmű, hogy fejlődtem :))) .. Tetszett, hogy lépésről lépésre elmagyarázták, és azokat elhelyezték az oldalon minden alapparancs + egy példa, amelyen dolgozhatunk .. egyértelmű, hogy tudod mit csinálsz, valódi tanárok vagytok !!
    Azonban többsége dolgozik web design a programok, amelyek automatikusan, hogy megrendeléseket, és a kérdésem nem egy bemutató egy ilyen program?
    Tudom, hogy a parancsok megértése és így a webdizájn program jobb megértése érdekében elkészítette ezt az oktatóprogramot ... de még mindig kíváncsi vagyok arra, hogy lássam, mit fogsz folytatni az oktatóprogramok sorozatával, mert sok a beszélgetés erről a témáról, még akkor is, ha egyesek ezt fontolóra veszik unalmas, amikor olyan oktatóprogramokról van szó, mint amilyeneket Dan készített, és gratulálok ennek az alkalomnak az oktatóanyaghoz ...

Kapcsolódó hozzászólás

Ez a weboldal cookie-kat használ.