namai - Duomenys
Ištekliai. Geriausi ištekliai mokytis html ir css Negailestingi ištekliai html

...Nors HTML sintaksę išmokti gana paprasta, vis dar yra daug elementų, atributų ir... kitų sąvokų, kurias turėsite išmokti ir sekti.... Nors šis kursas skirtas supažindinti Jūs susipažinsite su esminiais HTML dalykais, tai tikrai nėra sukurta tam, kad išmokytų jus kiekvieno turimo elemento ir atributo....Taigi, turėdamas tai omenyje, noriu jums pateikti keletą internetinių HTML išteklių... kurie tikrai gali jums padėti pradedi mokytis HTML ir… gali būti vertinga nuoroda vėliau, kai kuriate tavo paties puslapių... Dabar pradėsime nuo pačių specifikacijų...

Ir tai yra kažkas, du dokumentai, kuriuos tikrai turėtumėte pažymėti.…Taigi, tai yra W3Cs HTML5 versija.…Galite pamatyti, kad jie turi naujausią leidėjo versiją.…Galite žiūrėti redaktoriaus juodraštį…jei norite pažiūrėkite, kas eina žemyn, vamzdžiu....Ir tai gana didelis....Jei slinksiu žemyn, pamatysite, kad čia tik turinys....Ir aš net neperžiūrėsiu visų jų.…

Tęsti nuorašo automatinį slinkimą

Atnaujinta 2017-03-30 Išleista 2015-03-16

HTML yra programavimo kalba, kuri valdo žiniatinklį. Kaip ir bet kurią kitą kalbą, įvaldę ją, galite pradėti kurti savo turinį, nesvarbu, ar tai būtų paprastos svetainės, ar sudėtingos žiniatinklio programos. Šiame kurse išsamiai apžvelgiami pagrindiniai dalykai: HTML sintaksė ir geriausios praktikos Rašyti ir redaguoti savo kodą. Vyresnysis personalo autorius Jamesas Williamsonas apžvelgia įprasto HTML dokumento struktūrą ir parodo, kaip suskirstyti puslapius ir formatuoti turinį naudojant HTML Plus, išmokti kurti nuorodas ir sąrašus bei sužinoti, kaip su HTML veikia. CSS ir JavaScript, kad sukurtumėte turtingą, patrauklią naudotojo patirtį. Taigi atidarykite teksto rengyklę, žiūrėkite šiuos vaizdo įrašus ir pradėkite tinkamai kurti HTML.

Temos:

  • Kodėl HTML svarbus?
  • HTML dokumento tyrinėjimas
  • Turinio formatavimas
  • Rodomi vaizdai
  • Naudojant nav, article ir div elementus
  • Nuorodos į puslapius ir atsisiunčiamą turinį
  • Sąrašų kūrimas
  • Stiliaus valdymas (šriftai, spalvos ir kt.)
  • Pagrindinių scenarijų rašymas

Kas pasaulyje yra mieliausias, labiausiai rausta ir geidžiamiausias? Negalvokite nieko vulgaraus, turiu omenyje tik naują žymėjimo kalbos versiją – HTML5. Naujausios versijosŠiuolaikinės naršyklės jau supranta kai kuriuos HTML5 triukus, o tai reiškia, kad laikas pradėti jį naudoti savo projektuose.

Kas yra HTML5?

Iš pirmo žvilgsnio HTML5 yra tiesiog nauja versijažymėjimo kalba. Tačiau dabar šis terminas reiškia šiek tiek kitokį. Tiesiog absurdiška svarstyti apie HTML5 neminint CSS3, nes be jo neįmanoma sukurti tikrai modernių žiniatinklio programų. Mes negalime pamiršti apie JavaScript. Jos pagalba įgyvendinama prieiga prie HTML5 standarte aprašytos turtingos API. Apibendrinant visa tai, kas išdėstyta pirmiau, pateikiamas apibrėžimas: HTML5 yra šiuolaikinių technologijų / standartų (JS, HTML5, CSS3 ir tt), naudojamų kuriant žiniatinklio programas, rinkinys.

Lašas istorijos

HTML5 neatsirado staiga. Jo kūrimas prasidėjo dar 2007 m. Už darbo procesą buvo atsakinga specialiai sukurta W3C konsorciumo grupė. Tačiau daugelis HTML5 funkcijų buvo išrastos pagal Web Application 1.0 standartą, ir jos buvo naudojamos nuo 2004 m. Taigi iš tikrųjų HTML5 nėra tokia jauna technologija, kaip gali pasirodyti iš pirmo žvilgsnio.

Pirmasis HTML5 specifikacijos juodraštis tapo prieinamas 2008 m. sausio 22 d. Praėjo treji metai, tačiau galutinė specifikacijos versija vis dar neparengta ir vargu ar bus parengta per ateinančius metus ar dvejus. Ši liūdna akimirka įpareigoja kūrėjus savo projektuose atidžiai taikyti naujas funkcijas. Specifikacija gali lengvai pakeisti, o ne visos šiuolaikinės naršyklės (FireFox 4, Google Chrome 10, IE9, Opera 11) visiškai palaiko naujas funkcijas.

Sveiki receptai

Apie HTML5 teoriją galime kalbėti labai ilgai, tačiau mūsų rubrika vadinasi „Kodavimas“, tad kviečiu praktiškai išbandyti standarto galimybes. Nesivarginau kurdama itin originalių receptų, bet nusprendžiau pateikti pavyzdžių, kurie tikrai naudingi ir kuriuos dabar galima ir reikia naudoti jūsų svetainėse. Taigi, eime.

Receptas Nr. 1: Įjunkite Drag&Drop iki galo

Vienas iš malonių HTML5 dalykų (turbūt nereikėjo vartoti tiek daug energetinių gėrimų, nes ten turėtų būti žodis „gudrybės“ – red. pastaba) HTML5 buvo galimybė naudoti failų API ir „Drag and Drop“ API.

Su jų pagalba galite organizuoti gražų failų perkėlimą iš vartotojo kompiuterio į serverį. Prisiminkite, kad anksčiau visada buvo laukas su mygtuku „Naršyti“, kad galėtumėte siųsti failus? Paspaudus jį, pasirodė standartinis failo pasirinkimo dialogo langas, kuriame turėjote pasirinkti failą, kurį norite perkelti. Šį metodą būtų sunku pavadinti patogiu. Ypač kai reikia įtraukti kelis failus į atsisiuntimo eilę.

Kiek vėliau meistrai pradėjo kurti blykstės įkėlimo programas, kurios suteikė daugiau funkcionalumo, tačiau turėjo rimtą trūkumą – būtinybę įdiegti blykstę. Be to, abiem atvejais vartotojas neturėjo galimybės pridėti failų, kuriuos būtų galima perkelti tiesiog vilkdamas pelę ant puslapio.

Tačiau Drag&Drop technologija sistemoje naudojama gana dažnai. Aš asmeniškai visada norėjau tiesiog pabrėžti reikalingus failus ir su lengvu žiurkės pamoju mesti jį ant puslapio. Tai daug patogiau nei ieškoti failo naudojant standartinį dialogo langą.

HTML5 pakoregavo, ir dabar niekas netrukdo organizuoti visavertį „Drag&Drop“ failą perkelti į puslapį. „Google“ darbuotojai buvo pirmieji, įdiegę šią funkciją „Gmail“. Jei naudojate Google, tikriausiai jau seniai pastebėjote sritį, kurioje galite vilkti failus, kuriuos norite pridėti prie laiško. Asmeniškai aš aktyviai naudojuosi šia funkcija ir dabar parodysiu, kaip sukurti tą patį savo projektui. Mūsų projektą sudarys trys failai: sample.html, style.css ir scripts.js. Žinoma, galėtume apsiriboti vienu html failu, bet tada kodas pasirodys neįskaitomas. Nereikia maišyti HTML su JS ar CSS. Geriau viską suskaidyti į failus ir tada ramiai su jais dirbti. Pirmiausia paruošime savo programos struktūrą. Sukurkite failą sample.html ir įrašykite jame:








Nuvilkite failus čia



Kad būtų patogiau rašyti kodą „JavaScript“, įtraukiau jquery biblioteką. Po to aprašiau būsimo html dokumento struktūrą. Tai velniškai paprasta – reikia aprašyti lauką, į kurį vartotojas turėtų nuvilkti failus. Tam reikia tik vieno div konteinerio. Jei dabar atidarysite puslapį naršyklėje, nieko gero nepamatysite. Kad mūsų laukas būtų vizualiai pastebimas, turime jį suprojektuoti naudodami CSS. Atidarykite style.css failą ir įrašykite į jį šį kodą:

#dėžė (
plotis: 500 pikselių;
aukštis: 300 pikselių;
kraštinė: 2px brūkšninis #000000;
fono spalva: #FCFFB2;
teksto lygiavimas: centre;
spalva: #3D91FF;
šrifto dydis: 2em;
šriftų šeima: Verdana, sans-serif;

Moz-border-spindulys: 8px;
-Webkit-border-radius: 8px;
}
#label (
padėtis: santykinė;
viršuje: 2%;
}

„Dėžutės“ identifikatorius yra mūsų būsimas failų priėmimo konteineris (vartotojas turi vilkti dokumentus į šią sritį). Kad vartotojas nepraleistų, padidinu plotą ir kaip kadravimo parinktį parenku punktyrines - punktyrines linijas. Įprastos punktyrinės linijos atrodo nelabai gerai, todėl iš karto nustatau ypatybių reikšmes: -moz-border-radius ir -webkitborderradius. Dabar galite atidaryti sukurtą puslapį naršyklėje ir įvertinti bendrą išvaizdą.

Tačiau jei bandysite ką nors vilkti dabar, nieko įdomaus neatsitiks. Nuvilktas failas tiesiog atsidarys žiniatinklio naršyklėje ir viskas. Nedidelė JavaScript kodo dalis padės ištaisyti situaciją:

$(document).ready(function() (

//Pridėti įvykių tvarkykles

Var mybox = document.getElementById("box")

Mybox.addEventListener("vilkiklis", dragEnter, false);

Mybox.addEventListener("dragexit", dragExit, false);

Mybox.addEventListener("dragover", dragOver, false);

Mybox.addEventListener("drop", drop, false);
});
funkcija dragEnter(evt) (

Evt.stopPropagation();

Evt.preventDefault();
}
funkcija dragExit(evt) (

Evt.stopPropagation();

Evt.preventDefault();
}
funkcija dragOver(evt) (

Evt.stopPropagation();

Evt.preventDefault();
}
funkcija drop(evt) (

Evt.stopPropagation();

Evt.preventDefault();

Var failai = evt.dataTransfer.files;

Var count = failai.ilgis;

Jei (skaičius > 0)

HandleFiles(failai);
}
function handleFailai(failai) (

//Paimkite pirmąjį failą

//Jei reikia dirbti su keliais

//failai, tada čia reikia organizuoti paiešką

Var failas = failai;

Document.getElementById("label").innerHTML =
"Pagauta: " + failo.pavadinimas;

Var skaitytuvas = new FileReader();

Reader.onprogress = handleReaderProgress;

Reader.readAsDataURL(failas);
}
function handleReaderProgress(evt) (

If (evt.lengthComputable) (

Jei (evt.loaded = evt.total) (

Alert("Įkelta...");
}
}
}

Iš pirmo žvilgsnio kodas gali pasirodyti gremėzdiškas ir nesuprantamas, tačiau bent kiek susipažinę su JavaScript ir jquery turėtų iš karto suprasti, kas vyksta. Pačioje pradžioje identifikuoju įvykius, kurių įvykis mane domina. Kiekvienai iš jų aprašau atskirą funkciją. Pavyzdžiui, dragExit įvykis įvyksta, kai vartotojas perkelia pelės žymeklį nuo vilkamo elemento. Jei vartotojas tempia failą, valdymą perima funkcija handleFiles().

Jame aš sąmoningai prieinu prie paties pirmojo failo (failų) ir pradedu su juo dirbti. Atminkite, kad vartotojas gali vilkti ir mesti kelis failus vienu metu. Jei jūsų programa turi sugebėti susidoroti su tokiomis situacijomis, mes suorganizuosime paiešką visame failų masyve. Funkcija handleFiles() yra ta vieta, kur vyksta visos linksmybės.

Pirmiausia etiketės elemente (pamenate užrašą "Vilkite failus čia"?) rodau failo, kurį vartotojas nuvilko į aktyvią sritį, pavadinimą, tada pradedu jį skaityti naudodamas FileReader() tipo objektą. . Daugiau apie tai galite perskaityti šiame straipsnyje: html5rocks.com/tutorials/file/dndfiles. Tik tuo atveju apibrėžiu onProgress įvykių tvarkyklę, skirtą FileReader() tipo objektui. Šis įvykis bus iškviestas kiekvieną kartą, kai nuskaitoma duomenų dalis. Pačioje tvarkyklėje nustačiau sąlygą: jei įkeliamų duomenų kiekis lygus failo dydžiui, vadinasi, skaitymas sėkmingai baigtas ir gali būti rodomas laimingas pranešimas.

Receptas Nr. 2: gerkite alų, žiūrėkite vaizdo įrašus, klausykite roko

Prieš atsirandant HTML5, vaizdo įrašai internete buvo žiūrimi naudojant visų rūšių „flash“ grotuvus. Tai nereiškia, kad tokiu būdu žiūrėti vaizdo įrašus yra nepatogu. Vienintelė problema yra saugumo srityje (pastaruoju metu Flash grotuvas tiesiog knibžda pažeidžiamumų) ir būtinybė įdiegti patį papildinį. HTML5 standartas siūlo elegantišką sprendimą – integruotą galimybę leisti vaizdo ir garso turinį.

Tikriausiai daugelis jau atspėjo, kad aš kalbu apie žymas ir . Jie leidžia įterpti garso ir vaizdo įrašus tiesiai į puslapį. Vienintelis nusivylimas, su kuriuo turime susidurti, yra palaikomų kodekų rinkinys. Deja, kiekvienai naršyklei šis rinkinys yra skirtingas, todėl didelė tikimybė, kad jūsų vaizdo įrašas Chrome naršyklėje bus rodomas puikiai, tačiau FireFox vartotojai liks miške. Norint nepatekti į tokią situaciją, rekomenduojama pasirūpinti apsauginiu tinkleliu – vaizdo įrašo paleidimu naudojant Flash grotuvą. Kalbėjomės apie mielumą (ne, juk jis nesupainiojo žodžių, jį teks gydyti elektrokonvulsine terapija nuo priklausomybės anime - Lozovskio pastaba) ir problemas, o dabar pereikime prie praktikos. Norėdami parodyti vaizdo įrašo atkūrimą, pateikiau paprastą pavyzdį:



Čia turėtų būti vaizdo įrašas. Jei matote šį tekstą, jūsų naršyklė nepalaiko naujo standarto.


Atkreipkite dėmesį, kad žymos pavyzdyje nurodžiau plakato atributą. Jame nurodysiu kelią į grafinį failą, kuris turėtų būti rodomas iškart po puslapio įkėlimo - „pirmasis kadras“.

Kuo tai gali būti naudinga? Arba galite įterpti savo įmonės/projekto logotipą kaip tokį vaizdą. Žyma taikoma tokiu pačiu būdu. Tai leidžia vienu metu nurodyti kelis medijos failo šaltinius. Taigi galite įkelti tą patį failą skirtingais formatais (ogg, mp3). Jei vartotojo naršyklėje nėra mp3 kodeko, bus bandoma paleisti ogg. Pasirodo, paprastomis manipuliacijomis nesunku išspręsti suderinamumo problemą ir būti tikram, kad vartotojas galės atkurti turinį.

3 receptas: kur esate dabar (geografinės vietos API)

Geolokacijos API yra programinė sąsaja, skirta vartotojo koordinatėms nustatyti. Remiantis gautais duomenimis, paprasta pažymėti vartotojo vietą, tarkime, Google Maps. Kur galima naudoti šią funkciją? Taip, daug kur! Pavyzdžiui, populiarios mikrotinklaraščių paslaugos „Twitter“ kūrėjai „Twitter“ kliento žiniatinklio sąsajoje naudoja geografinės vietos nustatymo API. Jei vartotojas leidžia bendrinti savo vietą, miestas, kuriame jis šiuo metu yra, bus įtrauktas į visus jo tviterius.

Neabejoju, kad dabar jus kankina klausimas: „Iš kur GAPI gauna savo vietos informaciją? Net nemanykite, kad tai susiję su šnipų palydovais ir kitais Bondo dalykais. Viskas daug proziškiau – informacijos paketas analizei kuriamas remiantis duomenimis apie IP adresą, šalia esančius Wi-Fi taškus, GPS (jei yra įrenginys), GSM celės ID ir pan. Jei jus domina apytikslių koordinačių gavimo iš aukščiau išvardytų šaltinių teorija ir praktika, patariu atidaryti aplanką ][ ir rasti Stepo straipsnį šia tema, kuriame jis nuodugniai išanalizavo teorinę dalį ir taip pat apžvelgė atitinkamą programinę įrangą. Dabar pažvelkime į GAPI naudojimo pavyzdį. Viskas labai paprasta ir aišku:





if (navigator.geolocation) (
navigator.geolocation.getCurrentPosition(
funkcija (padėtis) (
document.getElementById("platuma").innerHTML =
padėtis.koordelės.platuma;
document.getElementById("ilguma").innerHTML =
padėtis.koordijos.ilguma;
},
);
}

Platuma: nežinoma

Ilguma: nežinoma



Prieš bandydami gauti koordinates, turite įsitikinti, kad jūsų naršyklė palaiko GAPI. Jei geografinės vietos nustatymo metodas buvo teisingas, tada viskas tvarkoje ir galite pabandyti gauti koordinates. Norėdami tai padaryti, naudosime navigatoriaus objekto metodą getGurrentPosition. Jei pavyks, gausime koordinates, kurios bus išsiųstos tiesiai į dokumentą.

4 receptas: duomenų bazė naršyklėje

Kurdami žiniatinklio programas esame įpratę naudoti duomenų bazes. MySQL, SQLite yra kiekvienam programuotojui pažįstami produktai. Penktoji HTML versija mums atneša dar vieną dovaną – galimybę naudoti atskirą SQLite duomenų bazę. Sustabdyti!

Pasirodo, visi duomenys bus saugomi vartotojo kompiuteryje? Taip tiksliai. Nereikia šaukti, kad tai nesaugu. Tam tikriems projektams ši funkcija gali būti naudinga. Deja, dar ne visos naršyklės leidžia dirbti su šia duomenų baze.

Pavyzdžiui, IE9 ir FF4 šios funkcijos dar neturi, todėl su funkcija praktiškai susipažinti galite tik Google Chrome naršyklėje. Aš nepateiksiu tikrojo kodo pavyzdžio, bet parodysiu tik bendrą veikimo principą:

this.db = openDatabase("xakep", "1.0", "testas", 8192);
tx.executeSql("sukurti mano lentelę, jei jos nėra " +
"checkins(id sveikasis pirminis raktas asc, lauko_numerio_viena eilutė)",
, function() ( console.log("Užklausa sėkmingai užbaigta"); ));
);

Atidžiau pažvelgę ​​į aukščiau pateiktą pavyzdį pastebėsite, kad apskritai darbas su integruota duomenų baze vyksta lygiai taip pat, kaip ir su įprastu SQLite: atidarome duomenų bazę, paruošiame užklausos tekstą ir jį vykdome.

HTML5.Shutdown()

Ar savo projektuose naudosite HTML5, ar ne, priklauso nuo jūsų. Manau, kad dabar pats laikas. Jei esate profesionalus svetainių kūrėjas, nepatingėkite įterpti HTML5 funkcijų dabar. Žinoma, nepamirškite pasirūpinti suderinamumu – įdiekite palaikymą tiek šiuolaikinėms, tiek pasenusioms naršyklėms. Turite viską, ko jums reikia. Nesulėtinkite tempo ir stenkitės, kad jūsų projektai išsiskirtų iš kitų. Sėkmės!

Kaip apsidrausti?

Visame šiame straipsnyje aš tai sakiau šiuo metuŠiuolaikinės naršyklės palaiko įvairaus laipsnio HTML5 funkcijas. Būtent todėl reikia būti atsargiems ir stengtis nenaudoti labai egzotiškų dalykų. Iš karto kyla klausimas: „Kaip sužinoti, kokias HTML5 funkcijas palaiko konkreti naršyklė? Yra keletas būdų, kaip išspręsti šią problemą, bet mano mėgstamiausia yra naudoti mažą JavaScript biblioteką, pavadintą Modernizr (modernizr.com).

Biblioteka platinama visiškai nemokamai, o prijungus ją prie projekto iškart bus rodomas HTML5 funkcijų, kurias palaiko jūsų naršyklė, sąrašas. Norint išbandyti bibliotekos funkcionalumą, nereikia iš karto jos atsisiųsti ir prijungti prie projekto. Jums tereikia eiti į oficialią bibliotekos svetainę ir iškart pamatysite, ką palaiko jūsų naršyklė, o ko ne. Peržiūrėkite apsilankymo svetainėje ekrano kopijas, kada Google pagalba Chromas ir Internet Explorer 9. Nepaisant geros viešųjų ryšių kampanijos ir liaupsinančių straipsnių, Microsoft naršyklė aiškiai palaiko mažiau funkcijų nei Google Chrome.

HTML5 pakeis „Flash“.

Viena įdomiausių HTML5 savybių yra galimybė kurti animacijas. Tai pasiekiama maišant HTML5 ir CSS3.

Ši animacija atrodo gana gražiai ir daugeliu atvejų gali pakeisti „Flash“. Galiu drąsiai teigti, kad tai neįvyks labai greitai, nes dabar lengviau įvaldyti Flash, nei suprasti neaiškų HTML5/CSS3 kodą (IMHO). Nepaisant to, jūs turite žinoti apie tokią funkciją. Labai rekomenduoju sekti toliau pateiktas nuorodas ir savo akimis pamatyti gražias demonstracines versijas, demonstruojančias animacijos galimybę.

  • Graži demonstracinė versija, parodanti Canvas galimybes: feedtank.com/labs/html_canvas;
  • Gražus 3D laukelis su įmontuota Google paieškos juosta: ;
  • Vienas paspaudimas ir puslapis pradės pildytis kamuoliukais. Daugiau paspaudimų – daugiau kamuoliukų. Užpildę puslapį iki kraštų, pabandykite juos smarkiai vilkti. Labai juokingai atrodo: mrdoob.com/projects/chromeexperiments/ball_pool ;
  • Tiesiog nuostabi demonstracinė versija, kurioje rodomi įvairūs cheminiai junginiai. Tikrai verta dėmesio: alteredqualia.com/canvasmol;
  • Ar kada nors norėjote pasijusti patologu ir tyrinėti žmogaus kūno paslaptis?

Jei taip, tada ši nuoroda tikrai skirta jums. „Google“ sukūrė puikią demonstracinę versiją naudodama WebGL, HTML5, CSS3 ir Flash technologijų derinį. Kokteilio rezultatas – interaktyvi 3D žmogaus kūną demonstruojanti aplikacija, kurioje galima ištirti vidaus organų sandarą. Kai pamačiau jį pirmą kartą, negalėjau atsiplėšti.

Nusprendžiau tęsti šią karštą temą. Sudariau geriausių html ir css mokymosi šaltinių sąrašą, kad padėtų tiems, kurie domisi šiomis problemomis. Prisimenu, kai pradėjau dirbti žiniatinklio valdytoju, labai pasiilgau tokio kokybiškų ir naudingų išteklių pasirinkimo.

Pirmiausia kai kurie apibrėžimai:

Html (iš anglų kalbos „HyperText Markup Language“ – hiperteksto žymėjimo kalba) yra standartinė tinklalapių žymėjimo kalba.

Css (iš anglų kalbos „Cascading Style Sheets“ – pakopiniai stiliaus lapai) – tai technologija, skirta apibūdinti tinklalapio išvaizdą.

Neturint html ir css žinių, svetainės paleidimas bus labai problemiškas – net negalėsite įdiegti statistikos skaitiklio ar net reklamjuostės. Ar neturėtume kreiptis pagalbos į specialistus ar kurti temą po temos forumuose? Reikia tik imti ir išmokti.

Iš savo patirties galiu pasakyti, kad html ir css galima išmokti per 1 mėnesį. Žinoma, aš nekalbu apie profesines aukštumas – jei norite, galite jas pasiekti patys.

Mano nuomone, Geriausias būdas mokytis html, css ir kitų temų, įskaitant svetainių reklamavimą, reiškia turėti savo svetainę ir joje praktikuotis. Beje, galite pamatyti pirmąją svetainę, kurią sukūriau žaidimo Counter-Strike žemėlapiams, kurio kūrimo tada labai norėjau. Štai žemėlapiai ir jų ekrano nuotraukos, kurias sukūrė senukas Globatorius tais laikais, kai jis dar nežinojo, kas yra top 10, TCI ir PR, ir nerūpestingai šėlo saulėje kurdamas trimačius žemėlapius :) Šią svetainę sukūriau per mėnesį, praktiškai mokydamasi html ir css.

Nereikia būti techniniu ekspertu, kad išmoktum html ir css. Pavyzdžiui, aš apskritai esu humanistė, o matematikoje dažniausiai gavau „2“ :) Taigi kiekvienas gali išmokti html ir css. Mano išvardyti ištekliai taip pat yra tinkami, kad bet kuriuo metu galėtumėte juos naudoti norėdami sužinoti bet kurį jus dominantį HTML ir css klausimą.

Svetainės, skirtos mokytis html ir css

Pradėsiu rinkti naudingus išteklius, skirtus mokytis html ir css iš svetainės, kurią naudojau pats. Tai yra laukinės HTML pamokos, kurias parašė Valentina Akhmetzyanova dar žinoma kaip Dikarka. Ji taip linksmai ir įdomiai aprašė visus reikalingus punktus, kad html ir css mokymasis jos pamokų pagalba virsta įdomia veikla. Beje, galite perskaityti tinklaraščio svetainę. Laukinių pamokų užtenka norint išmokti html ir css tokiu lygiu, koks reikalingas norint dirbti žiniatinklio valdytoju.

Ar įsivaizduojate, kas aš būčiau, jei toliau plėtočiau „Photoshop“ temą? Aš būčiau tikras monstras! Bet aš čia įsitraukiau į SEO ir vegetuoju, rašydamas šias raides kreivais nuo šalčio pirštais :) Juokauju, čia irgi šilta, o maistas geras :)

Paskutinį kartą atnaujinta 2019 m. lapkričio 9 d., 06:54:54 (UTC/GMT +8 val.)

Kas yra HTML?

HTML reiškia „Hyper Text Markup Language“, naudojama kuriant tinklalapius ir kitų tipų dokumentus, kuriuos galima peržiūrėti žiniatinklio naršyklėje.

HTML yra World Wide Web Consortium nurodytas ir prižiūrimas standartas.

Nuo jo išradimo HTML išsivystė įvairiomis versijomis. Dabartinė HTML versija yra HTML 4.01.

Kita HTML versija yra HTML 5, kuri yra kuriama, tačiau kūrėjai jau pradėjo naudoti kai kurias jos funkcijas.

Tolesniuose puslapiuose mes išsamiai aptarsime HTML 4.01. Kurį išmokę galėsite patys kurti tinklalapius.

Paprasto tinklalapio HTML kodas

HTML puslapio pavyzdys Tai yra HTML puslapio pavyzdys

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc at nisi velit, aliquet iaculis est. Curabitur porttitor nisi vel lacus euismod egestas. In hac habitasse platea dictumst. In sagittis magna eu odio interdum mollis. Phasellus sagittis pulvinar facilisis. Donec vel odio volutpat tortor volutpat commodo. Donec vehicula vulputate sem, vel iaculis urna molestie eget. Sed pellentesque adipiscing tortor, at condimentum elit elementum sed. Mauris dignissim elementum nunc, non elementum felis condimentum eu. In turpis quis erat imperdiet vulputate. Pellentesque mauris turpis, dignissim sed iaculis eu, euismod eget ipsum. Vivamus mollis adipiscing viverra. Morbi at sem eget nisl euismod porta. Sed semper, tortor eu molestie iaculis, felis massa vestibulum massa, vitae suscipit arcu nunc quis ante. Phasellus aliquam elit ir nisl condimentum commodo. Nunc congue nibh aliquam enim aliquet, niekur kitur nepriskirtas feugiat diam condimentum. Suspendisse potenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam accumsan velit sed lacus pellentesque in gravida nunc ultrices. Aliquam varius scelerisque erat ut egestas.

Išmokite HTML iš svetainės

Tai yra HTML puslapio pavyzdys

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc at nisi velit, aliquet iaculis est. Curabitur porttitor nisi vel lacus euismod egestas. In hac habitasse platea dictumst. In sagittis magna eu odio interdum mollis. Phasellus sagittis pulvinar facilisis. Donec vel odio volutpat tortor volutpat commodo. Donec vehicula vulputate sem, vel iaculis urna molestie eget. Sed pellentesque adipiscing tortor, at condimentum elit elementum sed. Mauris dignissim elementum nunc, non elementum felis condimentum eu. In turpis quis erat imperdiet vulputate. Pellentesque mauris turpis, dignissim sed iaculis eu, euismod eget ipsum. Vivamus mollis adipiscing viverra. Morbi at sem eget nisl euismod porta. Sed semper, tortor eu molestie iaculis, felis massa vestibulum massa, vitae suscipit arcu nunc quis ante. Phasellus aliquam elit ir nisl condimentum commodo. Nunc congue nibh aliquam enim aliquet, niekur kitur nepriskirtas feugiat diam condimentum. Suspendisse potenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam accumsan velit sed lacus pellentesque in gravida nunc ultrices. Aliquam varius scelerisque erat ut egestas.

W3resource HTML vadovėlių ypatybės

Apėmėme visus HTML 4.01 elementus arba žymas ir jų atributus. Kadangi tai yra HTML elementai (arba žymos) ir atributai, kuriuos reikia suprasti norint išmokti HTML. Aptardami HTML žymą arba elementus HTML mokymo programose, naudojome šias funkcijas, kad padėtų jums geriau suprasti:

1. Pradėjome nuo aiškaus ir paprasto aprašymo.

2. Pateikėme sintaksę, kad galėtumėte prisiminti, kaip ją parašyti.

3. A Naudokite norėdami parodyti, kaip tai parašyti praktiškai.

4. Mes parodėme naudojimo rezultatą.

5. Kadangi HTML žymos gali turėti arba neturėti pabaigos žymos elementui uždaryti, mes visada rodydavome, ar reikia pradžios ir pabaigos žymų, ar ne.

6. Kuriai Kategorijai priklauso HTML elementas, t.y. jei jis skirtas tekstui ar antraštei, formoms kurti ir pan.

7. Kokie kiti elementai arba kokio tipo turinys gali būti HTML žymoje.

8. Kuriuose gali būti kiti elementai, kuriuos HTML žyma gali turėti.

9. Įvairūs tos žymos atributai, jų aprašymas ir pavyzdžiai.

10. Tos HTML žymos pavyzdys.

11. To pavyzdžio rezultatas.

12. Peržiūrėkite pavyzdį naršyklėje.

13. Kaip ta žyma atrodo skirtingose ​​naršyklėse.

Šiame puslapyje pateikiama medžiaga, skirta asmenims, dalyvaujantiems kuriant standartus.

Dauguma šios informacijos nėra apsaugota slaptažodžiu. Tačiau norint pasiekti kai kuriuos puslapius, gali prireikti slaptažodžio.

Elgesio kodeksas

ISO komitetų, darbo grupių ar „Susirinkdami pasiekti konsensusą“ nariai skatinami dirbti pagal Elgesio kodekso principus.

Konkurencijos atitikties vadovai

Teisės aktų laikymasis standartų nustatymo procese yra svarbus siekiant užtikrinti veiksmingą rinkos mechanizmų veikimą ir didinti konkurencingumą, taip pat padidinti pasitikėjimą standartais. ISO teikia gaires teisiniais klausimais visiems standartų kūrimo proceso dalyviams.

Visus klausimus, susijusius su konkurencijos teisės gairėmis, galite kreiptis į ISO teisininkų komandą adresu elektroninio pašto adresas.

Autorių teisės

Visi standartizacijos veiklos dalyviai turi gerbti autorių teises, susijusias su ISO publikacijomis ir projektų kūrimu, taip pat bet kokiu su ISO susijusiu turiniu. Šios taisyklės atsispindi Deklaracijoje, su kuria turi sutikti visos standartizacija suinteresuotos šalys.

Komiteto darbo su išorės šalimis komunikacijos ir dokumentų saugojimo politika

ISO standartų kūrimo procesų dalyviai gali būti skatinami (pavyzdžiui, naudojant žiniasklaida) arba gali kilti savo iniciatyva (pavyzdžiui, per socialiniai tinklai) keistis informacija su išorės šalimis apie įvairius komiteto darbo aspektus. ISO sukūrė tokios išorinės sąveikos veiklos politiką.

Visais klausimais, susijusiais su šia politika, galite kreiptis paštu TMB sekretoriatas: .

Duomenų apsaugos politika

Visos standartizacijos procese dalyvaujančios šalys turi teises ir pareigas dėl duomenų apsaugos. Jie atsispindi Duomenų apsaugos politikoje, parengtoje ISO nariams, taip pat Deklaracijoje, kurios turi laikytis visos dalyvaujančios šalys. šis procesas. Jis taikomas ISO IT tarnybose saugomiems duomenims, taip pat daugeliui asmens duomenų, surinktų atliekant standartizacijos darbus (pvz., lankomumo sąrašus, protokolus).

ISO standartuose vartojamų terminų ir posakių paaiškinimas Tarptautiniai standartai ir prekyba Teisinių sankcijų rūšys ISO

ISO parengė dokumentą, kuriame apibendrinami su sankcijomis ir standartų kūrimo procesu susiję klausimai.

Suinteresuotųjų šalių įtraukimas ir sutarimo siekimas

ISO darbu siekiama užtikrinti, kad standartus rengtų suinteresuotosios šalys, suinteresuotoms šalims, kad rinkos poreikiai būtų patenkinti veiksmingiau.

Žemiau rasite dokumentus, kuriuose pateikiamos suinteresuotųjų šalių įtraukimo gairės.



 


Skaityti:



Spalvota muzika arduino Spalvota muzika avr mikrovaldiklyje

Spalvota muzika arduino Spalvota muzika avr mikrovaldiklyje

Lengva muzika atmega8 valdiklyje patraukė dėmesį dėl savo gamybos paprastumo. Kartojant schemą nereikėjo skaičiuoti...

Ką daryti, jei „Mac“ įkaista sistemoje „Windows“ Atvėsinkite „MacBook“ sistemoje „Windows“.

Ką daryti, jei „Mac“ įkaista sistemoje „Windows“ Atvėsinkite „MacBook“ sistemoje „Windows“.

Daugelis „Mac“ vartotojų tikriausiai yra susidūrę su situacija, kai ji buvo tokia aukšta, kad atrodė, kad ji pakils. Paprastai tai nėra...

Jūsų „Mac“ pradės nepaprastai lėtėti, tačiau to galima išvengti

Jūsų „Mac“ pradės nepaprastai lėtėti, tačiau to galima išvengti

Aimaks, mini, macbook savininkams ir visiems, kuriems rūpi per didelė jų įrenginių temperatūra.UPD: viskas, kas parašyta žemiau, yra konkrečiai...

Kokios yra žaidimo ypatybės „European Archeage“ serveryje?

Kokios yra žaidimo ypatybės „European Archeage“ serveryje?

„Trion Worlds“ pradėjo dirbti su korėjietiško žaidimo „ArcheAge“ lokalizavimu 2013 m., iš karto atidarydama išankstinę registraciją beta versijos testavimui. 17...

tiekimo vaizdas RSS