HTML oznake su osnova HTML jezika. Oznake se koriste za razgraničenje početka i kraja elemenata u markupu.
Svaki HTML dokument sastoji se od stabla HTML elemenata i teksta. Svaki HTML element je identificiran početnom (otvaranjem) i završnom (završnom) oznakom. Otvaranje i zatvaranje oznake sadrže naziv oznake.
Svi HTML elementi podijeljeni su u pet tipova:
- prazni elementi - , ,
, , , ,, ,
Koristi se za skladištenje Dodatne informacije o stranici. Pretraživači koriste ove informacije za obradu stranice i tražilice- za njegovo indeksiranje. U bloku može biti nekoliko oznaka, jer ovisno o korištenim atributima nose različite informacije. Indikator mjerenja u datom opsegu. Odjeljak dokumenta koji sadrži navigacijske veze za web lokaciju. Definira odjeljak koji ne podržava skriptiranje. Kontejner za ugrađivanje multimedije (npr. audio, video, Java apleti, ActiveX, PDF i Flash). Također možete umetnuti drugu web stranicu u trenutni HTML dokument. Oznaka se koristi za prosljeđivanje parametara dodatka. Uređena numerisana lista. Numeracija može biti numerička ili abecedna. Kontejner s naslovom za grupu elemenata. Određuje opciju/opciju za odabir sa padajuće liste , ili . Polje za prikaz rezultata izračuna izračunate pomoću skripte. Paragrafi u tekstu. Definira parametre za dodatke ugrađene pomoću elementa. Element kontejnera koji sadrži jedan element i nula ili više elemenata. Sam po sebi ne prikazuje ništa. Omogućava pretraživaču da odabere najprikladniju sliku.
Izlazi tekst bez formatiranja, čuvajući razmake i prijelome teksta. Može se koristiti za prikaz kompjuterski kod, poruke Email itd. Indikator izvršenja zadatka bilo koje vrste. Definira kratki citat. Kontejner za Istočnoazijski likovi i njihovo dešifrovanje. Definira svoj ugniježđeni tekst kao osnovnu komponentu napomene. Dodaje kratak opis iznad ili ispod znakova sadržanih u elementu, prikazano manjim fontom. Označava ugrađeni tekst kao dodatnu bilješku. Izlazi alternativni tekst u slučaju da pretraživač ne podržava element. Prikazuje tekst koji nije aktuelan sa precrtanim. Koristi se za prikaz teksta koji predstavlja rezultat izvršenja programski kod ili scenarij, kao i sistemske poruke. Prikazuje se monorazrednim fontom. Koristi se za definiranje skripte na strani klijenta (obično JavaScript). Sadrži ili tekst skripte ili ukazuje na eksterni fajl skriptu koristeći src atribut. Definira logičko područje (odjeljak) stranice, obično sa zaglavljem. Kontrolni element koji vam omogućava da odaberete vrijednosti iz predloženog skupa. Vrijednosti varijanti su smještene u . Prikazuje tekst u manjoj veličini fonta. Određuje lokaciju i tip alternativnih medijskih resursa za , , . Kontejner za inline elemente. Može se koristiti za formatiranje odlomaka teksta, kao što je isticanje pojedinačnih riječi bojom. Stavlja naglasak u tekst, ističući ga podebljanim. Uključuje tabele stilova koji se mogu ugraditi. Određuje pisanje simbola ispod indeksa, na primjer, indeks elementa u hemijskim formulama. Kreira vidljivi naslov za oznaku. Prikazuje se popunjenim trouglom, klikom na njega možete vidjeti detalje naslova. Određuje pravopis znakova u nadskriptu. Oznaka za kreiranje tabele. Definira tijelo tabele. Kreira ćeliju tabele. Koristi se za deklarisanje fragmenata HTML koda koji se mogu klonirati i umetnuti u dokument pomoću skripte. Sadržaj oznake nije njen potomak. Kreira velika polja za unos teksta. Definira podnožje tabele. Kreira naslov ćelije tabele. Definira naslov tabele. Definira datum/vrijeme. Naslov HTML dokumenta koji se pojavljuje na vrhu naslovne trake pretraživača. Može se pojaviti i u rezultatima pretraživanja, tako da to treba uzeti u obzir prilikom davanja naslova. Kreira red tabele. Dodaje titlove za elemente i . Ističe odlomak teksta podvlačenjem, bez dodatnog naglaska. Kreira listu sa nabrajanjem. Ističe varijable iz programa prikazujući ih kurzivom. Dodaje video fajlove na stranicu. Podržava 3 video formata: MP4, WebM, Ogg. Ukazuje pretraživaču gdje bi duga linija mogla prekinuti. Da proširimo mogućnosti pojedinačni elementi atributi se primjenjuju. Postoje dvije vrste atributa: atribut s vrijednošću i Boolean atribut koji nema vrijednost. Atributi se pišu unutar uvodne oznake, nekoliko atributa je navedeno odvojeno razmakom, njihov redoslijed nije bitan.
Atribut s vrijednošćuPrvo napišite početnu oznaku, zatim ime atributa odvojeno razmakom, nakon čega slijedi znak jednakosti (=) i vrijednost atributa u navodnicima. Opća sintaksa je:
…
Ovdje slovo E označava ime proizvoljnog elementa. Za samozatvarajuće elemente sve će biti isto, osim sadržaja i završne oznake.
Umjesto dvostrukih navodnika („vrijednost“) možete pisati jednostruki navodnici("vrijednost") ili izostavite navodnike (vrijednost) u potpunosti. Međutim, dobra je praksa uvijek pisati vrijednosti atributa u navodnicima, jer njihovo izostavljanje može dovesti do implicitnih grešaka. Dajemo mali primjer.
U ovom primjeru, prvi red je ispravno napisan sa svim navodnicima i in sljedeći red Atribut alt nema navodnike. Pošto razmak odvaja jedan atribut od drugog, pretraživač će uzeti samo prvu riječ (“View”) kao alt vrijednost i tretirati riječ “title” kao novi atribut. Ali budući da takav atribut ne postoji, to će dovesti do greške.
Svaki atribut mora biti jedinstven i ne smije se ponavljati (alt se može pisati, alt alt se ne može pisati).
Primjer 1 pokazuje kako dodati sliku na stranicu pomoću elementa
sa različitim atributima.
Primjer 1: Korištenje atributa
Dodavanje slike
Logički atributi
Logički atributi nemaju vrijednosti; samo prisustvo ili odsustvo atributa već mijenja ponašanje elementa. Sintaksa je prilično jednostavna:
…
Primer 2 pokazuje upotrebu logičkog atributa za audio plejer.
Primjer 2: Upotreba Booleovog atributa
Dodavanje zvuka
Logički atributi se mogu upisati tri vrste: bez vrijednosti, sa prazna vrijednost i vrijednost koja odgovara imenu atributa. Sve opcije su ekvivalentne, ali je preporučljivo da se držite jedne odabrane forme snimanja.
- kontrole
- kontrole=""
- controls="kontrole"
Opet, imena atributa ne razlikuju velika i mala slova, što znači da se mogu pisati malim ili malim slovima velikim slovima. Ali preporučujemo da se pridržavate uniformnosti i upisujete atribute mala slova-ime. A ne Ime ili IME. Još jednom naglasimo da nema potrebe pisati na ovaj način.
Redoslijed atributaRedoslijed atributa u elementu nije bitan i ne utječe na rezultat prikaza elementa. Također je moguće premjestiti atribute u drugu liniju. Sljedeći unosi su ekvivalentni po svom učinku.
Univerzalni atributi
Neki elementi imaju svoj skup karakterističnih atributa, ali postoje i atributi koji se mogu dodati bilo kojem elementu. Iz tog razloga se nazivaju univerzalnim ili globalnim atributima. Možete vidjeti listu svih takvih atributa; mi ćemo navesti samo neke popularne: class, id, lang, style, title.
Pozdrav, dragi čitaoci blog stranice! U prošlom članku smo shvatili koja je vrsta dokumenta i kako pretraživači određuju jezik koji se koristi pomoću . Oznaka je uzeta u obzir, ali sam koncept (termin) nije. U ovom članku ću vam reći šta je oznaka, zašto je potrebna i koje vrste oznaka postoje. Kao što sam rekao u poslednjem članku ovog odeljka, kreiraćemo stranicu sa fajlom, sa kojom ćemo eksperimentisati, na osnovu znanja koje smo stekli. Ali ovo je na kraju članka, ali za sada pogledajmo HTML tag.
Šta je HTML tag, vrste HTML tagova, primeri pisanja HTML tagova – prevedeno sa engleskog tag – za označavanje – znakovi zatvoreni u ugaone zagrade i koji su elementi jezika za označavanje hiperteksta (HTML). Simboli mogu biti od neke koristi engleski jezik(cijeli Internet je izgrađen na njemu). Oznaka izgledaOvo je oznaka za isticanje teksta podebljano. Oznake imaju tri tipa:
- Početna oznaka je oznaka koja dolazi na početku. U gore navedenom primjeru, oznaka je početna oznaka i stoji ispred teksta koji treba istaknuti.
- Završna oznaka je oznaka koja dolazi na kraju. Prepoznatljiva karakteristika služi kao kosa crta “/” ispred znakova u ugaonim zagradama. Pogledajmo još jednom primjer o kojem smo gore govorili. Oznaka je završna oznaka i dolazi nakon teksta, koji treba istaknuti podebljanim slovima
- Pojedinačne oznake su oznake koje nemaju završnu oznaku. Primjer bi bio
Evo primjera oznake za otvaranje i zatvaranje:
Cijeli dizajn, uključujući i tekst, izgledat će ovako:
Ovaj tekst će biti istaknut podebljanim slovima
A ovako će izgledati ovaj tekst kada ga pretraživač obradi i pruži nam: Ovaj tekst će biti označen podebljanim slovima. Postoji i takva stvar kao oznake kontejnera, ali ovo je samo generalizirani naziv za oznake za otvaranje i zatvaranje. Kao što sam gore napisao, pored oznaka kontejnera, postoje i pojedinačne oznake. Razlika je u tome što takve oznake ne moraju biti zatvorene. Najsjajniji i najsjajniji čest primjer služi kao oznaka za novi red.
U osnovi, pojedinačne oznake se koriste za umetanje elementa, kao što je slika ili tabela.
Šta su atributi, pravila pisanja i zašto su potrebna?Pored oznaka postoje i tzv. atributi. Tačnije, ne pored, već u oznakama. Koristeći atribute koje možete postaviti Dodatne opcije za bilo koju oznaku. Svaki tag ima svoje atribute, a u ovoj temi ćemo eksperimentisati sa tagom, koji bez atributa zapravo ne radi ništa smisleno.Font je oznaka kontejnera koja se koristi za formatiranje teksta. Koristeći ovu oznaku, možete podebljati tekst, promijeniti veličinu i razmak između redova - općenito, sve što možete učiniti s tekstom. Pogledajmo primjer s veličinom teksta. Prvo, stavimo tekst u oznaku Font.
Tekst
Sada malo o pravilima za pisanje atributa. Atributi se uvijek pišu u početnoj oznaci i iza znakova same oznake. Možete napisati više atributa u jednu oznaku bilo kojim redoslijedom. Atribute možete pronaći na web stranici W3C validatora (o čemu ću pisati u nastavku). Dakle, evo primjera oznake fonta s atributom veličine:
Tekst
Ovaj atribut u oznaci fonta mijenja veličinu teksta koji je zatvoren u oznakama.
Ako otvorite izvor stranicu, vidjet ćete da je mjesto gdje je velika riječ"Tekst" izgledaTekst
Već ste vidjeli kako se pišu atributi. One su napisane na potpuno isti način u drugim tagovima: prvo pišemo sam atribut (u u ovom slučaju size), zatim stavite “=” i priložite parametar atributa dvostruki navodnici. Sve parametre atributa možete pronaći na istoj web stranici konzorcija svjetske mreže.
Šta je W3C validator, pravila pisanja i lista oznaka Kao što sam napisao, postoji mnogo oznaka. Ali gdje ih sve pronaći? W3C W3C validator postoji za ovu svrhu - World Wide Web Consorcium, ili na ruskom - World Wide Web Consortium. Nije sasvim jasno, zar ne? Ovo je mjesto gdje se razvijaju web standardi - (jezici za označavanje hiperteksta su njihova ideja). Na čelu cijelog konzorcijuma je Tim Berners-Lee, poznat iz prethodnog članka, tvorac HTML-a. Web stranica ove organizacije je w3.org. Upozoravam vas, stranica je u potpunosti na engleskom jeziku, tako da imate rečnik ili prevodioca u pretraživaču. Inače, Google ocjena za ovu stranicu je 9 i 37.000 (ovo je sve puno, ako neko ne zna).Vratimo se na temu članka. Zanimaju nas jezički standardi HNTML 4.01. Slijedite vezu HTML 4.01 Specifikacija, nakon čega vidimo karticu elemenata na vrhu, kliknite na nju. Ovdje se otvara stranica sa svim oznakama. Ove oznake su razvijene i usvojene kao standard od strane konzorcijuma. Sve je, opet, na engleskom. Odmah iza riječi “Indeks elemenata” vidimo legendu (značenje slova u kolonama):
I odmah nakon legende nalazi se tabela samih oznaka:
- U prvoj koloni - Ime - naziv same oznake - šta treba biti u uglatim zagradama (< и >).
- Druga kolona - Start Tag - prisustvo uvodne oznake. IN ovu kolonu možete vidjeti slovo “O”, što znači “Opcionalno”, au prijevodu sa engleskog – Opciono. Ovo slovo je prisutno samo naspram oznaka , , i znači da možete staviti početnu oznaku, ili ne morate – pretraživač će sve uraditi sam.
- Treća kolona - End Tag - prisustvo završne oznake. Nasuprot ove oznake možete vidjeti i slovo “O” i slovo “F”. Značenje prvog se nije promijenilo. Drugo slovo - "F" - doslovno "zabranjeno" na engleskom - znači da je zabranjeno stavljati završnu oznaku, jednostavno ne postoji. Na primjer, ne postoji oznaka, jer u njemu nema šta da se krije.
- Četvrti - Empty - znači da je oznaka jednostruka (prazna). Sve oznake koje imaju slovo “E” ispred sebe u ovoj koloni imaju i slovo “F” u prethodnoj koloni. Nakon svega, pojedinačne oznake nema završnih. Primjer je ista oznaka
.
- Peta kolona je Depr. ili Deprecated - od engleskog “ne preporučuje se”. Ako ova kolona sadrži slovo “D” (koje znači potpuno isto) to znači ovu oznaku ne preporučuje se za upotrebu u HTML-u. Gledajući malo unaprijed, danas za dizajn i teksta i izgled Cijela web lokacija i HTML dokument koriste kaskadne tablice stilova (CSS). Ukratko i jednostavno, kreira se jedna datoteka u koju su upisani svi tekstualni parametri koji se mogu pozvati određenim atributima tagova. dakle, ovu funkciju koristi se samo na web stranicama, jer CSS nije primjenjiv pri slanju vijesti putem e-pošte ili RSS-a. I ovdje ove iste oznake dolaze u pomoć. Većina ovih oznaka se, inače, odnosi na dizajn teksta (i predstavljaju primjer)
- Šesta kolona - DTD - može sadržavati slovo "L" ili "F". Prvi - "L" - Loose DTD - znači da je oznaka nasuprot dato pismo, može se koristiti samo u prelaznom tipu dokumenta (- Transitional, o čemu sam pisao u prethodnom članku). Drugi - "F" - Frameset DTD - znači da se oznaka može koristiti samo u dokumentu tipa FRAMESET ( - Frameset). Ako slovo nedostaje, tada se oznaka može koristiti u svim vrstama dokumenata.
- I poslednja, sedma kolona - Opis - Kratki opis tag, opet na engleskom
Atributi se nalaze na istoj stranici specifikacije HTML 4.01, ali na kartici „atributi“. Postoji mnogo više atributa nego oznaka. I opet ću sve zapisivati tačku po tačku.
- Prva kolona je Ime – kao u slučaju oznaka, naziv atributa. Sve je na engleskom, ali ima osnovno znanje možete pogoditi šta radi ovaj ili onaj atribut.
- Druga kolona - Povezani elementi - je lista svih oznaka koje koriste bilo koji atribut. Sve oznake imaju veze, tako da možete odmah otići na informacije o oznaci.
- Treći stupac - Tip - su sve moguće vrijednosti za određeni atribut. Na primjer, suprotno od onog koji smo odabrali atribut veličine V Oznaka fonta vrijednost je CDATA. Kasnije ćemo to pogledati, ali ukratko, to je poseban skup opcija veličine (u ovom slučaju). Na kraju krajeva, možete pisati i piksele i procente
- Četvrta kolona – Podrazumevano – pokazuje da li je atribut potreban u određenoj oznaci. Na primjer, u oznaci Img attribute src je obavezan, jer ukazuje na izvor iz kojeg treba uzeti sliku.
- Kolone 6, 7 i 8 znače isto kao i u slučaju oznaka.
Sve gore navedeno se odnosi samo na HTML verzije 4.01. O HTML 5 ćemo govoriti u drugom članku, a dotaknućemo se i XHTML-a. A sada, kao što sam obećao, napravićemo stranicu na HTML jezik, sa kojim ćemo eksperimentisati.
Kreiranje datoteke u html formatu - HTML dokumentPrije svega, hajde da shvatimo šta je HTML dokument. A ovo je, u stvari, fajl u njemu HTML format. I sve Internet stranice su HTML dokumenti. Na primjer, kada stignete na lokaciju u adresna traka na kraju možete vidjeti “.html” ili “.htm” nakon adrese. Ovo je fajl koji ćemo kreirati sa ovom ekstenzijom. Općenito, ako želite eksperimentirati s web lokacijom, a ne sa stranicom, onda je bolje da kreirate lokalni server— Denver (o kome želim sve da napišem).
S obzirom da nisam ni govorio o tagovima prisutnim na svakoj stranici, jednostavno ćemo kreirati fajl sa bilo kojim imenom i ekstenzijom.html. Moguće je (i najbolje) koristiti Notepad++ jer u ovom slučaju uređivač teksta Koristi se isticanje koda, što je vrlo zgodno prilikom uređivanja koda, a datoteke se mogu pohraniti u različitim formatima. Postoje i programi u kojima se, kada upišete kod, rezultat odmah pojavljuje u obrađenom obliku.
Dakle, samo trebamo otvoriti Notepad++ i sačuvati datoteku sa slobodan tekst(može biti prazan), ali u .html formatu. Da biste to učinili, kao i obično, kliknite na natpis datoteke, zatim "sačuvaj kao" i pretražite među velika lista Ekstenzije "HyperText Markup Language (ekstenzije datoteka)". To je sve, zapravo. Prve retke ovoj datoteci ćemo dodati u sljedećem članku iz odjeljka “Kreiranje web stranice od nule”
Posljednje ažuriranje: 04.08.2016
Prije nego što prijeđemo direktno na kreiranje vaših web stranica u HTML5, pogledajmo osnovne građevne blokove koji čine web stranicu.
HTML5 dokument, kao i svaki drugi HTML dokument, sastoji se od elemenata, a elementi se sastoje od oznaka. Tipično, elementi imaju oznaku za otvaranje i zatvaranje, koje su zatvorene u ugaonim zagradama. Na primjer:
tekst elementa div
Ovdje je definiran element div, koji ima oznaku za otvaranje i oznaku za zatvaranje. Između ovih oznaka nalazi se sadržaj elementa div. U ovom slučaju, sadržaj je jednostavan tekst "Tekst elementa div".
Elementi se također mogu sastojati od jedne oznake, na primjer element
, čija je funkcija da prekine liniju.Tekst
div elementTakvi elementi se nazivaju i prazni elementi. Iako sam koristio završnu kosu crtu, njeno prisustvo je opciono prema specifikaciji i ekvivalentno je korištenju oznake bez kose crte:
Svaki element unutar početne oznake može imati atribute. Na primjer:
Dugme
Ovdje su definirana dva elementa: div i input. div element ima atribut stila. Nakon znaka jednakosti, vrijednost atributa se piše u navodnicima: style="color:red;" . U ovom slučaju, vrijednost je "color:red;" označava da će boja teksta biti crvena.
Drugi element - ulazni element, koji se sastoji od jedne oznake, ima dva atributa: tip (označava tip elementa - dugme) i vrijednost (definira tekst gumba)
Postoje globalni ili zajednički atributi za sve elemente, kao što je stil, a postoje i specifični koji se primjenjuju na određene elemente, kao što je tip.
Pored redovnih atributa, postoje i Booleovi atributi. Slični atributi možda nije važno. Na primjer, možete postaviti disabled atribut za dugme:
Atribut disabled označava da je element onemogućen.
Globalni atributiHTML5 ima skup globalnih atributa koji se primjenjuju na bilo koji HTML5 element:
accesskey : definira ključ za brz pristup do elementa
class : specificira CSS klasu koja će biti primijenjena na element
contenteditable: određuje da li se sadržaj elementa može uređivati
contextmenu : definira kontekstni meni za element koji se prikazuje kada kliknete na element desni klik miševi
dir: postavlja smjer teksta u elementu
prevlačenje: određuje da li se element može prevući
dropzone: određuje da li se podaci o zoni ispuštanja mogu kopirati kada se ispuste na element
hidden : sakriva element
id : Jedinstveni identifikator elementa. Elementi na web stranici ne bi trebali imati duple identifikatore
lang : specificira jezik elementa
provjera pravopisa : označava da li će postojati za ovog elementa korištena provjera pravopisa
style : postavlja stil elementa
tabindex : Definira redoslijed kojim se stavke mogu mijenjati pomoću tipke TAB
naslov : setovi dodatni opis za element
translate : određuje da li sadržaj elementa treba biti preveden
Ali, po pravilu, od cijele ove liste najčešće se koriste tri: klasa, id i stil.
Prilagođeni atributiZa razliku od prethodna verzija Dodani su HTML5 jezici za označavanje prilagođeni atributi(prilagođeni atributi). Sada programer ili kreator web stranice može definirati bilo koji atribut stavljajući mu prefiks podaci-. Na primjer:
Ovdje je definiran atribut boje podataka i ima vrijednost "crveno". Iako ne postoji takav atribut za ovaj element, niti u html-u općenito. Sami ga definiramo i postavljamo na bilo koju vrijednost.
Jednostruki ili dvostruki navodniciČesto možete pronaći slučajeve u kojima se i jednostruki i dvostruki navodniki koriste u html-u prilikom definiranja vrijednosti atributa. Na primjer:
I jednostruki i dvostruki navodniki su prihvatljivi u ovom slučaju, iako se dvostruki navodnici češće koriste. Međutim, ponekad sama vrijednost atributa može sadržavati dvostruke navodnike, u kom slučaju je bolje staviti cijelu vrijednost u jednostruke navodnike:
U prošlom članku sam vam govorio o tome kako ih koristiti itd. A danas ću vam reći o još jednom sastavnom dijelu u izradi web stranice, odnosno o atributima html oznake. I naravno, po tradiciji, pogledat ćemo ih na primjerima uživo i isprobati na našoj web stranici s Lukomorye, koju smo predstavili u prošlom članku.
Atribut je poseban dodatak oznaci koji proširuje njene mogućnosti i može promijeniti svojstva sadržaja. A ako je oznaka uvijek fiksna, onda atribut može imati mnogo vrijednosti. Na primjer, u tag možemo staviti atribute boje teksta, veličine teksta, fonta itd. Ali font ćemo detaljnije pogledati u drugom članku.
Postoje univerzalni i neuniverzalni atributi. Univerzalne su pogodne za gotovo sve oznake, a one neuniverzalne za jednu ili više, ali ne sve...
Atribut se upisuje unutar oznake nakon njene vrijednosti, ali prije zagrade ugla. Prvo se stavlja sam atribut, zatim znak jednakosti, a zatim sama vrijednost u navodnicima. izgleda ovako:
Tekst
Šta slijedi iz ovog primjera? Otvorili smo pasus, a unutar oznake smo stavili align atribut, koji je odgovoran za poravnavanje teksta. Zatim stavljamo znak “=”, što znači da ovom atributu dodjeljujemo vrijednost. Dalje u navodnicima pišemo upravo ovu vrijednost. U ovom slučaju to je "centar". To znači da će tekst u ovom (i samo ovom!) pasusu biti centriran. Probajte sami.
Ali ne zaboravite da pogledate web stranicu htmlbook. Tamo ćete sigurno pronaći šta odgovara čemu. Ovo je jednostavno desktop referenca za svakog web developera, posebno početnika.
Kao što ste već shvatili, ovaj atribut znači poravnavanje teksta. Obično se stavlja u one tagove koji su odgovorni za sam sadržaj (tekst, slike itd.). U principu, možete ga staviti u naslove (,...,), u paragrafe (
), slike
, blok element ().
Moguće vrijednosti atributi:
- lijevo — lijevo poravnanje (zadano)
- desno — desno poravnanje
- centar — poravnanje po sredini
- justify - poravnanje po cijeloj širini
Pokušajte vježbati i vidjeti kako se raspored vaših elemenata mijenja.
Naslov
Poznato ime, zar ne? Zaista. Postoji takva oznaka i stavljamo je između i . Ali sada govorim konkretno o atributu, i on odgovara gotovo svakoj oznaci, budući da je univerzalan. I potreban je kao nagoveštaj pri lebdenju. A poenta je da vi sami pišete ovaj trag. To izgleda otprilike ovako:
Šta je 5-3?
Šta vidimo ovdje? Na početku otvorimo pasus, zatim upišemo sam atribut i damo mu vrijednost „Zašto si glup? Biće 2." Zatim pišemo prikazani tekst, a na kraju zatvaramo tag
.
Šta se dešava nakon ovoga? Sačuvajte dokument i uvjerite se sami. Kada zadržite pokazivač iznad teksta, trebao bi se pojaviti opis alata.
Višestruke vrijednostiJedna oznaka može sadržavati bilo koji broj atributa. Glavna stvar je da odgovaraju ovoj etiketi. Evo primjera:
Sadržaj
Kao što vidite, ovdje je sve prilično jednostavno, samo trebate napisati sve atribute odvojene razmakom u jednu oznaku. Od ovaj primjer vidimo da će sadržaj biti poravnat udesno, a kada pređemo preko njega kursorom miša, pojavit će se tooltip. To je jednostavno. Nadam se da je sve jasno?
Pa, vratimo se sada našem Lukomorju, što smo radili na prošloj lekciji.
Živi primjer- Poravnajte sav tekst u dokumentu sa "Lukomorye" u sredinu (zajedno sa naslovima),
- U naslovu prvog nivoa stavite nagoveštaj „Autor rada je A.S. Puškin"
Ako nemate kompletiranu datoteku iz prethodne lekcije, uzmite je i stavite sve potrebnih atributa tako da sve radi po uputstvu.
A prema tradiciji, u početku sve radite sami. A ako to ne uspije, pogledajte korake koje sam napisao u nastavku.
Nakon toga, sačuvajte html dokument i pokrenite ga. Hajde da proverimo šta imamo. Da li je sve tačno? Mislim da bi ti sve trebalo da prođe. Ali ipak, osjećam da su mnogi od vas umorni od stavljanja atributa u svaki katren. Pokazat ću vam kako da olakšate ovaj proces.
Ako trebate dodati isti atribut nekom velikom segmentu, onda će nam oznaka pomoći u tome. DIV je jednostavno prazan blok element koji služi kao neka vrsta kontejnera za grupisanje. Ovdje možete staviti različite atribute u svrhu njihove primjene na zajednički fragment. A ako općenito želite primijeniti atribut na cijeli dokument, onda ga općenito možete napisati u glavnoj oznaci.
Općenito, u ovom slučaju, ne morate stavljati atribut align="center" u svaku oznaku. Samo treba da ga stavite ispred naslova, i zatvorite ga uz pomoć na kraju celog teksta. Pa, unutra stavljamo align="center" , ali samo jednom. Po mom mišljenju to je mnogo brže i praktičnije i na kraju se dešava isto.
Pa kako? Shvatio sam opšti princip? Samo ćemo nastaviti da učimo još više. Glavna stvar je da razumijete princip raspoređivanja oznaka i atributa. Ako je potrebno, postavite svoja pitanja. Biće mi drago da im odgovorim.
Pa, za potpunu obuku o principu kreiranja web stranice, preporučujem da pogledate odličan video kurs “HTML5 i CSS3 od nule do profesionalca”. Tamo ćete naučiti HTML, CSS, naučiti kako dizajnirati web stranice za posjetnice, blogove, pa čak i online trgovine. Kurs je jednostavno fantastičan za početnike web programera.
Pa, završio sam za danas. Nadam se da vam se dopao članak i da vam je bio koristan. Ne zaboravite da se pretplatite na ažuriranja mog bloga kako biste uvijek bili svjesni najzanimljivijih stvari i ne propustite nove lekcije. Pa, pozdravljam se za danas. Želim vam uspjeh u savladavanju gradiva. Ćao ćao!
Srdačan pozdrav, Dmitry Kostin.
Najbolji članci na ovu temu
