HTML apmācība (iesācējiem)

HTML apmācība iesācējiemVai vēlaties uzzināt HTML?

Tā izklausās pēc lieliskas idejas. Tāpēc mēs esam izveidojuši šo HTML apmācību iesācējiem.

Mūsdienās pasaulē ir vismaz 1,7 miljardi vietņu. Praktiski visās šajās vietnēs vienā vai otrā veidā tiek izmantots HTML.

P.S .: Ja nevēlaties iemācīties HTML un nekavējoties sākt veidot savu vietni, nepieprasot kodēšanu, apskatiet šo rokasgrāmatu: Kā izveidot vietni BEZMAKSAS (neiemācoties HTML).

Ievads HTML


Kas ir HTML?

Kas ir HTMLHTML, HyperText Markup Language saīsinājums, ir datora valoda vietņu un tīmekļa lietojumprogrammu izveidošanai. Sastāv galvenokārt no kodu sērijām, kuras parasti tiek rakstītas teksta failā un saglabātas kā HTML. HTML valodā rakstīts kods pārvēršas skaistā, labi formatētā tekstā vai teksta un multivides kombinācijā, ja to aplūko pārlūkā.

HTML pirmo reizi izstrādāja britu fiziķis Tims Berners-Lī 1990. gadā, un kopš tā laika tas ir izgājis tik daudz evolūciju, ka ar jaunāko versiju var sasniegt daudz vairāk, nekā tika iedomāts iespējams, kad valoda pirmo reizi tika izgudrota..

Šajā apmācībā mēs apskatīsim HTML valodas pamatus un visu, kas jums jāzina, lai sāktu darbu ar HTML kā iesācējs.

HTML versijas

Pirmkārt, visu HTML versiju ātra noliegšana kopš HTML izgudrošanas.

  • HTML 1.0: Šī bija HTML versija bez kauliem un pati pirmā valodas izlaide.
  • HTML 2.0: Šī versija tika ieviesta 1995. gadā. Tā pakāpeniski attīstījās, ļaujot izmantot papildu iespējas, ieskaitot formātu balstītu failu augšupielādi, tabulas, klienta puses attēlu kartes un internacionalizāciju..
  • HTML 3.2: Mēģinot nodrošināt globālā tīmekļa standartu attīstību, Tims Berners-Lī 1994. gadā izveidoja globālā tīmekļa konsorciju (W3C). Līdz 1997. gadam viņi publicēja HTML 3.2.
  • HTML 4.0: Vēlāk 1997. gadā W3C izlaida HTML 4.0 – versiju, kas pieņēma daudzus pārlūkam raksturīgus elementu tipus un atribūtus.
  • HTML 4.0 vēlāk tika atkārtoti izdots ar nelieliem labojumiem 1998. gadā.
  • HTML 4.01: 1999. gada decembrī tika izlaists HTML 4.01.
  • XHTML: Specifikācijas tika ieviestas 2000. gadā, un tika ieteikts to izmantot kā kopīgu standartu ar HTML 4.01. Tajā tika iestrādāts XML, lai nodrošinātu koda pareizu uzrakstīšanu un programmēšanas valodu savietojamību.
  • HTML5: W3C kā ieteikumu publicēja HTML5 2014. gada oktobrī un vēlāk 2016. gada novembrī izlaida HTML 5.1.

HTML redaktora izvēle

Izvēlieties HTML redaktoruJa domājat izveidot tīmekļa lapas HTML formātā, jums ir nepieciešams HTML redaktors. HTML redaktora lietošanai ir vairākas priekšrocības.

Labs HTML redaktors uzturēs jūsu kodu tīru un sakārtotu. Tas arī noteiks, atverot jaunu tagu un automātiski to aizverot, lai izvairītos no kļūdaina koda, kā rezultātā samazināsies mašīnrakstīšanas apjoms. Lielākā daļa HTML redaktoru šodien ļauj jums priekšskatīt savu tīmekļa lapu, lai redzētu, kā tā izskatīsies tīmekļa pārlūkprogrammā, izmantojot viņu WYSIWYG funkciju.

Ir daudz bezmaksas un apmaksātu HTML redaktoru. Zemāk ir dažas no labākajām iespējām, no kurām jūs varat izvēlēties:

HTML pamata celtniecības bloki


Kad esat izlēmis par HTML redaktoru, kuru vēlaties izmantot, nākamais solis ir saprast HTML veidojošos elementus. Kodējot HTML, ir svarīgi saprast šos veidojošos elementus. Tajos ietilpst tagi, atribūti un elementi. Mēs tos apskatīsim zemāk:

Ievads tagos

Kad esat iedziļinājies HTML, vispirms jums jāsaprot tagi. Būtībā tagi atdala normālu tekstu no HTML koda.

Rezultātā, runājot par HTML, tagi atšķir to, vai jūsu dokuments tiek parādīts kā parasts teksts vai “pārveidots teksts”, kas būtībā ir teksta kods, kas, šķiet, parāda lietu virkni (hipersaites, attēli, multivide vai cita formatēšanas metodes), pamatojoties uz to, ko tas uzdod parādīt, pamatojoties uz tagiem.

Apskatīsim vārdu “Viņš ir zēns” kā piemēru:

  • Parastā teksta formātā jūs saņemat: Viņš ir zēns.
  • Bold teksta formātā jūs iegūsit: Viņš ir zēns

Lai sasniegtu to, kas mums ir treknrakstā, jums jāizmanto birka.

padarot tekstu treknrakstā html

Neapstrādātā HTML formātā mums ir Viņš ir zēns ko pārlūks pārveido šādi: Viņš ir zēns.

“Viņš ir zēns” varētu iznākt arī slīprakstā.

Tas tiek panākts, izmantojot birka.

padarot tekstu slīprakstā html

Mums ir: Viņš ir zēns kas pēc tam iznāk kā Viņš ir zēns.

Hipersaiti panāk, izmantojot birka.

padarot tekstu hipersaiti html

Neapstrādātā HTML formātā mums ir: Viņš ir zēns, kurš parāda, ka Viņš ir zēns.

Ir dažas lietas, kas jums jāsaprot par tagiem:

  • Tagi ir praktiski HTML pamatelements – jūs nevarat iztikt bez HTML! Ja esat iestrēdzis, kuru tagu izmantot, noteikti apskatiet mūsu HTML periodisko tabulu.
  • Gandrīz katrai atvērtai atzīmei jābūt aizvērtai. Paturiet prātā, ka ir izņēmumi. Taga piemērs, kas nav jāaizver, ir tukšs tags, piemēram, līnijas pārtraukums:
    .
  • Tagos ir mazāk nekā (““<”) and greater than (“>”) Leņķa stiprinājums. Noslēguma tagos ir slīpsvītra, kas kļūst pirms aizvērta taga nosaukuma. Atvērtā taga piemērs: . Slēgta taga piemērs .
  • Katrs HTML fails sākas ar sākuma tagu un beidzas ar noslēdzošo birku. HTML faila pirmajā rindā jādeklarē dokumenta tips, lai pārlūkprogramma zinātu, kādu HTML garšu jūs izmantojat. Tāpēc redzat, ka HTML lapas sākas ar “”Pirms HTML koda sākuma.

Pirms satura pievienošanas vairums HTML failu būtībā izskatās šādi:

HTML--

Sadaļa, kas seko tags parasti satur informāciju par dokumentu, piemēram, tā nosaukumu, metatagus un to, kur atrast tā CSS failu – saturu, kas nav tieši redzams pārlūka lapā. Sadaļa starp “ un”(Kuru mēs pārstāvējām ar“ GALVENĀ SATURA ”), kur atrodas HTML faila galvenais saturs, kuru skatītājs redzēs pārlūkprogrammā. Tas ietver visu, sākot no pirmās rindkopas līdz hipersaitēm līdz formatēšanai līdz multividei un visam citam.

Ievads elementos

ievads elementos

HTML formātā “elements” sastāv no sākuma un aizvēršanas taga, kā arī no satura starp tagiem.

Iekš “Viņš ir zēns”(Treknrakstā) piemērs, mums tas ir HTML: Viņš ir zēns. Tekstu “Viņš ir zēns” ieskauj atvērta un slēgta birka. Viss, ieskaitot sākuma tagu, saturu un aizvērto tagu, ir elements.

Atverot tagu, tiek ieviests saturs un tags tiek aizvērts, mums ir elements.

Elements var būt pamatformā vai sarežģītā formā. Kāpēc? Jo viss, kas atrodas starp atvērto tagu un noslēdzošo tagu, kā arī šos tagus, ir elements. Tas nozīmē, ka elementā var būt elementi. Mūsu pašreizējā piemērā “viņš ir zēns” (Viņš ir zēns) ir elements.

Jūs ievērosiet, ka mēs jau teicām, ka HTML dokumenti satur atzīmējiet pirms satura sākuma. Saturs varētu ietvert simtiem dažādu elementu, taču visi šie elementi ir daļa no “korpusa” elementa (jo korpusa elements ir atvērts, satur saturu un pēc tam tiek aizvērts).

Ievads atribūtos

Kaut arī HTML dokumentos pamatā visam tiek izmantoti tagi, mēs dažreiz vēlamies paziņot papildu informāciju elementa iekšienē. Šajā gadījumā mēs izmantojam atribūtu. Atribūts tiek izmantots elementa īpašību noteikšanai, tas tiek izmantots elementa sākuma tagā. Atribūtus veido vārds un vērtība.

Ņemiet vērā, ka atribūta vērtība tiek ievietota pēdiņās, izmantojot formātu Jūsu teksts.

atribūta piemērs

Piemērs:

Viņš ir zēns

Šajā piemērā mēs norādām, ka “Viņš ir zēns” ir izlīdzināts dokumenta centrā.

Darba sākšana ar HTML


Darba sākšana ar HTMLPieņemot, ka šodien vēlaties izveidot savu HTML pamatdokumentu, kā jūs sākat? Sākot ar lapu virsrakstu izveidi un beidzot ar veidlapu izveidi, mēs tālāk aprakstīsim, kā sākt darbu ar HTML.

HTML izveidošana Elements

Veidojot HTML dokumentu, viena no pirmajām lietām, ko jūs izveidosit, ir elements. Tas satur metadatus (vai datus par HTML dokumentu). Tas ietver tādu informāciju kā rakstzīmju kopa, dokumenta nosaukums, dokumenta stili, skripti utt.

Daži no elementiem iekļaut nosaukumu, kas ir izveidots ar birka.</p><p><strong>Piemērs</strong>:</p><pre><title>Šis ir mūsu lapas nosaukums

Šis nosaukums tiks parādīts pārlūka cilnē. Tas ir arī tas, kas tiks indeksēts kā lapas nosaukums, kad meklētājprogrammu roboti pārmeklēs jūsu vietni.

Tas ietver arī elements, ko bieži izmanto, lai norādītu informāciju, kuru meklētājprogrammas var izmantot, lai aprakstītu saturu sarakstos. Tas ietver aprakstu, atslēgvārdus, informāciju par autoru utt elements arī norāda rakstzīmju kopu, ko izmanto HTML dokuments.

Virsrakstu izveidošana HTML formātā

izveidojot virsrakstus html

Virsrakstiem ir liela loma vietnes panākumos. Pirmkārt, tie ļauj lasītājiem ērti skenēt jūsu lapu saturu. Otrkārt, un, iespējams, vēl svarīgāk, tie paziņo jūsu tīmekļa lapu struktūru meklētājprogrammām un tāpēc bieži ietekmē jūsu satura ranžēšanu meklētājprogrammu rezultātos..

Tomēr ir svarīgi izvairīties no virsrakstu tagu izmantošanas, lai jūsu teksts būtu liels vai trekns. Ir arī citi tagi, kurus var izmantot šim mērķim (pie tā mēs nonāksim vēlāk šajā sadaļā). Tā vietā virsrakstu tagus vajadzētu izmantot tikai struktūras izveidošanai.

HTML ir seši virsrakstu tagi:

uz

, Ar

birka, kas norāda vissvarīgāko pozīciju un

birka, kas norāda vismazāk svarīgo pozīciju.

Lai izveidotu virsrakstus, vienkārši izlemiet, kuru virsrakstu veidojat, atveriet virsrakstu ar parasto virsraksta tagu un vienmēr atcerieties aizvērt tagus, kad esat pabeidzis.

HTML virsrakstu piemērs:

  • Šis ir jūsu pirmais HTML virsraksts

    (lielākais)

  • Šis ir jūsu otrais HTML virsraksts

  • Šis ir jūsu trešais HTML virsraksts

  • Šis ir jūsu ceturtais HTML virsraksts

  • Šis ir jūsu piektais HTML virsraksts
  • Šis ir jūsu sestais HTML virsraksts

Rindkopu izveidošana

rindkopu izveidošana HTML formātā

Nākamais solis ir sākt izveidot rindkopas. Rindkopus var izveidot, izmantojot

birka.

Piemērs:

Šī ir jūsu pirmā rindkopa.

Šī ir jūsu otrā rindkopa, un jūs izveidosit daudz vairāk rindkopu.

Atcerieties, ka HTML rakstīšana ļoti atšķiras no rakstīšanas tīrā tekstā. Tāpēc, ja jūs sadalīsit tekstu HTML iekšienē, neuzsākot jaunu rindkopu, tam nebūs nozīmes, kad tekstu parādīs pārlūkprogramma. Tā vietā jūs vēlaties izmantot līnijas pārtraukumu, ko apzīmē ar
birka.

Piemērs:

Šī ir jauna rindkopa. Un es vēlos izmantot vairākas jaunas līnijas. Tāpēc es to sadalīšu.

Tas neizpaudīsies šādi:

Šī ir jauna rindkopa.
Un es vēlos izmantot vairākas jaunas līnijas.
Tāpēc es to sadalīšu.

Tā vietā tas iznāks šādi:

Šī ir jauna rindkopa. Un es vēlos izmantot vairākas jaunas līnijas. Tāpēc es to sadalīšu.

Tātad, kā jūs sadalāt tekstus jaunās rindās, lai tas parādītos šādi:

Šī ir jauna rindkopa.
Un es vēlos izmantot vairākas jaunas līnijas.
Tāpēc es to sadalīšu.

Izmantojot līnijas pārtraukumus.

Piemērs:

Šī ir jauna rindkopa.
Un es vēlos izmantot vairākas jaunas līnijas.
Tāpēc es to sadalīšu.

Tomēr ir svarīgi atzīmēt, ka līnijas pārtraukums (
) tags ir tukšs tags, tāpēc jums tas nav jāaizver.

Teksta formatēšana HTML formātā

formatēt tekstu HTML formātā

Nākamais solis ir formatēt tekstu HTML. Šeit varat norādīt, vai vēlaties, lai jūsu teksts tiktu parādīts treknrakstā, slīprakstā, pasvītrots, parakstīts, parakstīts ar virsrakstu utt. Šis ir pamata ceļvedis, tāpēc šī sadaļa formatēšanai nebūs galu galā. Tā vietā mēs iekļausim tikai dažus pamata formatēšanas tagus. Citu formatēšanas veidu izmantošana ir vienkārša – atrodiet vajadzīgo tagu un dodieties tālāk:

Izmantojot treknrakstu: Viņš ir zēns iznāk kā Viņš ir zēns

Izmantojot slīprakstu: Viņš ir zēns iznāk kā Viņš ir zēns

Pasvītrojums teksts: Viņš ir zēns iznāk kā Viņš ir zēns. Ir vērts atzīmēt, ka tags 4. novembrī tika novecojis, un tas tika atkārtoti definēts, lai HTML5 attēlotu stilistiski atšķirīgu tekstu. Tā rezultātā ir ieteicams izmantot CSS, lai norādītu tekstu, kas jāuzsver. Tā kā šis raksts ir pamata ceļvedis, mēs to vienkāršojam.

Izmantojot indeksu: Viņš ir zēns iznāk kā Viņš ir zēns

Izmantojot virsrakstu: Viņš ir zēns iznāk kā Viņš ir zēns

Citiem tagiem, kurus var izmantot formatēšanai, ieteicams apskatīt glosāriju šī resursa beigās, kur mēs esam iekļāvuši daudz atbilstošu HTML tagu.

Pasūtītie un nesakārtotie saraksti

Agrāk vai vēlāk jums būs jāizveido saraksti. Sarakstus varēja pasūtīt (t.i., numurētus) vai nekārtotus (t.i., bez numuriem).

Šeit ir pasūtīta saraksta piemērs:

  1. 1. postenis
  2. 2. postenis
  3. 3. postenis

To var izveidot šādi:

  1. 1. postenis
  2. 2. postenis
  3. 3. postenis

Šeit ir nesakārtota saraksta piemērs:

  • 1. postenis
  • 2. postenis
  • 3. postenis

To var izveidot šādi:

  • 1. postenis
  • 2. postenis
  • 3. postenis

Ja tas jau nav acīmredzams. Šis iedalījums:

  • tagu izmanto, lai norādītu katru saraksta vienību. Veidojot sarakstu, varat izmantot
      tags, lai norādītu sakārtotu sarakstu (“o” = pasūtīts un “l” = saraksts) vai

        tags, lai norādītu nesakārtotu sarakstu (“u” = nesakārtots un “l” = saraksts). Ieguvu būtību?

        Ligzdotu saraksti

        Mums var būt arī ligzdoti saraksti vai saraksts vienā sarakstā.

        Piemērs:

        • 1. postenis
          • 1. vienums ligzdots
          • 2. vienums ligzdots
        • 2. postenis
        • 3. postenis

        To var izveidot, izmantojot:

        • 1. postenis
          • 1. vienums ligzdots
          • 2. vienums ligzdots
          • 3. vienums ligzdots
        • 2. postenis
        • 3. postenis

        Kā redzat, jūs vienkārši atverat citu ierakstu tagu – pasūtīts (

          ) vai bez pasūtījuma (

            ) – atkarībā no tā, ko vēlaties pirms objekta aizvēršanas, kuru vēlaties ligzdot.

            izveidojot hipersaites HTML

            Tīmeklis ir viens no masveidā savstarpēji savienotajiem lapu tīkliem. Ja izveidojat vietni – gan iekšēji, gan ārēji, vai abas -, jums būs jāsaista ar citām lapām. Saiti uz iekšējo lapu jūsu vietnē vai uz ārējo lapu tīmeklī sauc par hipersaiti. Kaut arī cilvēki parasti saista tekstu, var sasaistīt jebkuru HTML elementu – piemēram, attēlu.

            tags tiek izmantots, lai definētu saites HTML, savukārt atribūts “href” tiek izmantots, lai norādītu saites mērķi. Pēc tam saite tiek ievietota citātā aiz zīmes “vienāds ar”, pirms tags tiek aizvērts.

            Piemērs:

            Lai izveidotu hipersaiti, rīkojieties šādi: JŪSU SAITES TEKSTS ŠEIT parādīsies kā JŪSU SAITES TEKSTS ŠEIT

            Tagad pieņemsim, ka jūs izveidojat saiti uz vietējo failu, kurā visas HTML lapas atrodas tajā pašā mapē. Šajā gadījumā jums nav jāiekļauj vietnes URL. Vienkārši pievienojiet faila ceļu. Piemēram, ja izveidojat saiti uz failu ar nosaukumu about-page.html, hipersaite kļūst par JŪSU SAITES TEKSTS ŠEIT, kas saites uz failu about-page.html.

            Ja HTML fails, kuru vēlaties saistīt, ir lokāls, bet mapē, kas nav galvenā mape, jūs vienkārši norādāt faila ceļu. Piemēram, ja fails atrodas mapē “faili” zem galvenā dokumenta, kur atrodas jūsu pašreizējais dokuments, hipersaite iet uz kaut ko līdzīgu JŪSU SAITES TEKSTS ŠEIT

            Jūs varētu norādīt, kā vēlaties atvērt saiti, piem. jaunā logā / cilnē. Tam jūs izmantosit mērķatribūtu.

            Piemēri:

            JŪSU SAITES TEKSTS ŠEIT norāda, ka saite ir jāatver jaunā cilnē.

            JŪSU SAITES TEKSTS ŠEIT norāda, ka saite būtu jāatver tajā pašā cilnē.

            Ir arī citi atribūti, kurus var izmantot, lai sazinātos dažādos veidos, kā vajadzētu atvērt saiti:

            • _blank – atvērt jaunā cilnē.
            • _self – atvērt tajā pašā cilnē.
            • _redzams – tiek atvērts pamata rāmī
            • _top – atvērt visā loga korpusā
            • kadra nosaukums – atveriet nosauktajā kadrā

            Jums var būt arī attēls, kas norāda uz saiti.

            Piemērs:

            Viņš ir zēns
            

            Tas pārlūkprogrammai liek parādīt attēlu, kas izvilkts no attēla faila “images / html-tutorial-for-aloners-3.jpg”, un tas ir saistīts ar https://websitesetup.org. Atribūts “alt” apzīmē to, kas jāparāda, ja attēlu nevar parādīt (pārlūka iestatījumu vai citu lietu dēļ, kas neļauj parādīt attēlus).

            Attēlu izmantošana

            izmantojot attēlus HTML formātā

            Attēli tiek pievienoti HTML dokumentam ar birka. tags ir tukšs tags, tāpēc tas nav jāaizver.

            Piemērs:

            Viņš ir zēns

            Šis ir pamata piemērs tam, kā pārlūkam tiek parādīts attēls ar attēlu “html-apmācība-iesācējiem-3.jpg”, kas izvilkts no tā paša direktorija kā HTML dokuments. Atribūts “alt” norāda pārlūkam parādīt tekstu (ko sauc par “alternatīvu tekstu”) ar nosaukumu “Viņš ir zēns”, ja kāda iemesla dēļ pārlūks vai interneta iestatījumi neļauj pārlūkam parādīt attēlus. Ja vēlaties ievietot attēlu citā direktorijā vai ārējā vietnē, jānorāda pilna adrese / ceļš.

            Pārsniedzot pamatus, mēs varētu izmantot arī citus atribūtus, lai attēlu labāk pielāgotu. Piemēram, atribūtu “style” var izmantot, lai norādītu platumu, augstumu vai abus.

            Piemērs:

            JŪSU ALTERNATĪVAIS TEKSTS

            (slīprakstā izmantotie “platums” un “augstums” jāaizstāj ar faktiskajām attēla vērtībām “px” (piemēram, “20 pikseļi”), kuras vēlaties iegūt savam attēlam.)

            Tabulu izveidošana

            tabulu izveidošana HTML formātā

            Padziļinoties HTML, jūs vēlēsities iemācīties dažādus veidus, kā sakārtotāk iesniegt informāciju. Viens no šādiem veidiem ir tabulu izmantošana.

            Tabulas tiek izveidotas ar

            birka. Katra tabulas galvene ir norādīta ar

            (“Tabulas rinda”) tags. Pēc tam tabulas datus norāda ar

            (“Tabulas galvenes”) tagu, kamēr katra rinda ir norādīta ar

            birka.

            Piemērs:

            1. tabulas galvene Galda 2. galvene Galda galvene 3
            Ievade 1 zem 1. galvenes 1. ievade zem 2. galvenes 1. ievade zem 3. galvenes
            Ievade 2 zem 1. galvenes Ievade 2 zem 2. galvenes Ievade 2 zem 3. galvenes
            3. ievade zem 1. galvenes 3. ievade zem 2. galvenes Ievade 3 zem 3. galvenes

            Tas mums dod kaut ko līdzīgu:

            1. tabulas piemērs

            Kā redzat, kamēr mums ir galds, tas ir nedaudz neorganizēts. Organizēšanai kodam var pievienot nedaudz stila. Šajā gadījumā mēs palielinām platumu:

            1. tabulas galvene Galda 2. galvene Galda galvene 3
            Ievade 1 zem 1. galvenes 1. ievade zem 2. galvenes 1. ievade zem 3. galvenes
            Ievade 2 zem 1. galvenes Ievade 2 zem 2. galvenes Ievade 2 zem 3. galvenes
            3. ievade zem 1. galvenes 3. ievade zem 2. galvenes Ievade 3 zem 3. galvenes

            Rezultāts ir kaut kas sakārtotāks:

            tabulas piemērs 2

            Jūs varētu vēlēties iet progresīvāk un izmantot apmales, iestatīt horizontālu vai vertikālu tabulas satura izlīdzināšanu, ieviest dalītājus, polsterējumu utt. Tomēr, lai veiktu šādus darbus, jums būs jāapgūst dažas CSS. Šī apmācība tiek saglabāta pamatīgi, un šajā rakstā mēs par to neiedziļināsimies.

            Citāti HTML formātā

            citāti HTML

            Ir dažādi kotējumu veidi, un šos piedāvājumus attēlo dažādi elementi.

            Piedāvājam pamata citātu, piemēram, šeit:

            Šis ir paraugs. Un Šeit ir mūsu citāts

            Tas iznāk šādi: Šis ir paraugs. Un “šeit ir mūsu citāts”

            Kad lietojat tags, pēdiņas tiek automātiski pievienotas tam, kas ir ievietots tagā.

            Varat arī izmantot bloķētas pēdiņas, kas tiek darīts ar

            birka.

            Piemērs:

            Šis ir paraugs. Un

            Šeit ir mūsu bloka pēdiņa. Šajā piemērā mēs cenšamies parādīt, kā formatēt tekstu, lai HTML norādītu bloka citātu. Tas atšķiras no parastajām pēdiņām ar to, ka faktiskais simbols "citāts" var tikt pievienots vai nav pievienots atkarībā no CSS stila, bet teksts ir iezīmēts.

            Tas izskatīsies šādi:

            1. bloka citāts

            Komentāru izmantošana HTML

            Veicot jebkādu kodēšanu, ir svarīgi iemācīties iekļaut komentārus kodā. Komentāri tiek izmantoti, lai jūsu kods būtu sakārtotāks. Jūs varat iekļaut atgādinājumu sev vai piezīmi citiem, lai viss būtu vieglāk.

            Sākotnēji tas varētu nelikties svarīgi, taču, kad jūs sākat rakstīt simtiem vai tūkstošiem koda rindu, un, kad lietas sāk šķist sarežģītas, noderēs komentāri.

            Komentārus pārlūks nerādīs skatītājam. Atcerieties, ka tos var redzēt avota kodā.

            Komentārus var izmantot arī jebkur kodā. Viņi nekādā veidā nemainīs jūsu koda funkciju.

            Jūs varat iekļaut komentāru, atverot iekavu, ieskaitot dubulto defisi, pievienojot komentāru, ieskaitot vēl vienu dubult defisi, un pēc tam aizverot iekavu.

            Piemērs:

            Ir arī vērts to atzīmēt, it īpaši atkļūdošanas laikā, jūs varat komentēt koda rindiņas. Tādā veidā kods paliek dokumentā, bet nedarbojas, jo jūs to esat komentējis.

            Piemērs:

            Šajā gadījumā, lai gan “Viņš ir zēns” vajadzētu iznākt tikpat drosmīgi, ka mēs to esam komentējuši, un pārlūks to ignorēs. Šajā scenārijā, ciktāl tas attiecas uz pārlūku, mums nekas nav.

            To var izmantot arī šādi:

            Viņš puika kas parāda Viņš zēns. Tas ir tāpēc, ka mēs komentējām “ir a”. Mēs tikai cenšamies parādīt, ka praktiski jebko, kas ir elements vai ārpus tā, var komentēt. Varat komentārā iekļaut piezīmi atsaucei – tas nemaina parādītā rakstura būtību.

            Krāsu izmantošana HTML

            krāsu izmantošana HTML

            Agrāk vai vēlāk jūs vēlēsities izmantot krāsas, lai norādītu noteiktus HTML dokumenta elementus. To var izdarīt trīs galvenajos veidos: ar HEX vērtību, ar RGB vērtību vai ar krāsas nosaukumu.

            Krāsas izmantošanu HTML parasti veic ar stila atribūtu.

            1. piemērs:

            Tā ir zilā krāsa

            Izmantojot HEX vērtību zilajai krāsai “# 0000FF”, mēs liekam pārlūkam parādīt jūsu tekstu (šajā gadījumā “Šī ir zilā krāsa”), izmantojot zilo krāsu.

            2. piemērs:

            Šī ir zaļā krāsa

            Mēs uzdodam tekstu izcelt zaļā krāsā, izmantojot RGB vērtību.

            3. piemērs:

            Šī ir dzeltenā krāsa

            Izmantojot HSL vērtību, mēs lūdzām, lai teksts tiktu izcelts dzeltenā krāsā.

            4. piemērs:

            Šī ir oranža krāsa

            Mēs izmantojam HTML krāsas nosaukumu (šajā gadījumā “oranža” – ko mēs uzsvērām kodā ar slīprakstu), lai lūgtu tekstu izcelt oranžā krāsā. Acīmredzot tas ir iespējams tikai tiem tekstiem, kuriem jūs zināt krāsu nosaukumus, un tas var būt grūti noteiktiem krāsu toņiem, ko var viegli izdarīt ar HEX kodu vai RGB vērtību. Neatkarīgi no tā, jūs varat atrast 140 HTML krāsu nosaukumi sastādījis HTML krāsu kodi.

            Saprotams, ka par visām krāsām jums nav visas nepieciešamās informācijas – piemēram, HEX kods, RGB vērtība utt. Nelieciet panikā – krāsu atlasītājs W3skolas ir lielisks rīks, kas ļauj izvēlēties jebkuru krāsu un parāda visu informāciju par šo krāsu, ieskaitot HEX kodu, RGB vērtību un HSL vērtību.

            IFrames izmantošana HTML

            HTML dokumentā iFrame (inline frame) var izmantot, lai iegultu failu pašreizējā dokumentā. Būtībā jūs to varat izmantot, lai pašreizējā vietnē parādītu citu vietni vai saturu no citas tīmekļa lapas.

            Piemērs:

            Izmantojot iepriekš minēto kodu, mēs sakām pārlūkprogrammai, lai rāda https://websitesetup.org saturu rāmī tieši šīs lapas iekšpusē..

            Iframe var izmantot, lai parādītu vietni, video, attēlus vai jebkura cita veida saturu.

            Kods tam ir vienkāršs:

            (vienkārši nomainiet “URL” ar saiti uz vietni / saturu, kuru vēlaties parādīt.)

            Jūs varat arī pielāgot, lai norādītu noteiktas iframe vērtības, piemēram, augstumu un platumu.

            Piemērs:

            Mēs sakām, ka pārlūkprogramma parāda iframe, izmantojot 350 pikseļu augstumu un 400 pikseļu platumu.

            Fonti HTML formātā

            izmantojot fontus HTML formātā

            Lai izveidotu efektīvus HTML dokumentus, ir svarīgi izprast fontu darbību. Pirmkārt, fonti ļauj ērti iestatīt teksta lielumu. Tas arī ļauj viegli iestatīt satura, kā arī sejas krāsu (vai fonta “tipu”).

            Lai norādītu fontu, kuru izmantos jūsu HTML dokuments, jums būs jāizmanto birka. Fonta lielumu, fonta krāsu vai fonta seju var iestatīt, izmantojot atribūtus “size”, “color” vai “face”.

            Iestatījuma lielums – piemērs:

            Parādiet šo tekstu, izmantojot 6. fonta lielumu

            Šajā piemērā mēs liekam pārlūkam parādīt mūsu tekstu, izmantojot fonta lielumu 6. Ir svarīgi ņemt vērā, ka pieņemto fontu izmēru diapazons ir no 1 līdz 7. Viss, kas pārsniedz 7, automātiski pielāgojas fonta lielumam 7. Noklusējums fonta lielums ir 3.

            Fonta krāsa – piemērs:

            Parādiet mūsu tekstu zilā krāsā

            Mēs izmantojam tags, lai pārlūkam lūgtu mūsu tekstu parādīt zilā krāsā. Šajā gadījumā mēs izmantojām HTML krāsas nosaukumu (“zils”). Ja vēlaties, to var aizstāt ar HEX kodu vai RGB vērtību.

            Fonta seja – piemērs:

            Vai jūs dodat priekšroku Verdana, nevis Times New Romans? Jūs to iestatījāt šādi:

            Lūdzu, parādiet šo tekstu Verdana fontā

            Mēs sakām, lai pārlūkprogramma parādītu mūsu tekstu Verdana fontā. Jūs varat vienkārši mainīt fonta nominālvērtību, lai norādītu jebkuru fontu, kuru vēlaties izmantot.

            Alternatīvas fontu sejas:

            Ir svarīgi ņemt vērā, ka cilvēki jūsu tekstu var redzēt tikai jūsu norādītajā fontā, ja viņiem tas ir instalēts datorā. Ja nē, tiks parādīta noklusējuma fonta seja – parasti Times New Roman. Šī iemesla dēļ ir ļoti ieteicams izmantot “tīmeklī drošus” fontus.

            Tas varētu palīdzēt iekļaut pēc iespējas vairāk alternatīvu fontu. Tādā veidā, pat ja viņiem nav jūsu galvenā fonta, jūs varat norādīt citus fontus svarīguma secībā. Tas tiek darīts, izmantojot komatu.

            Atpakaļ pie mūsu piemēra:

            Lūdzu, parādiet šo tekstu vispirms Verdana fontā vai Helvetica, Arial, vai Comic Sans… tādā secībā, ja galvenais fonts nav pieejams

            Mēs uzdevām pārlūkam parādīt tekstu Verdanā. Ja Verdana nav pieejama, tā vietā, lai atgrieztos pie noklusējuma Times New Romans, tā var parādīt Helvetica vai Arial, ja Helvetica nav pieejama, vai Comic Sans, ja Arial arī nav pieejama..

            Secinājums

            Noslēgumā jāsaka, ka HTML ir sarežģītāks nekā tas, kas jums ir šajā rokasgrāmatā. Neatsakieties no cerības – ja jūs varat aptvert pamatnostādnes šajā rokasgrāmatā, jūs esat uz labu sākumu. Tas ir tāpat kā valodas ABC pārzināšana, un viss pārējais kļūst daudz vienkāršāks.

            Ja jūs apmeklējāt šo mācību ar mērķi izveidot satriecošu vietni, mums ir žēl sarūgtināt – tā vienkārši nedarbojas šādā veidā. Šī ir pamata HTML apmācība. Tas ir šeit, lai palīdzētu jums izveidot pamatu, uz kuru varat balstīties. Jūs varat būt pārliecināti, ka, lai izveidotu izcilu vietni, tas prasīs ievērojami vairāk pūļu – un daudz izstrādes laika, bieži izmantojot valodu kombināciju..

            Izmantojot WordPress, kuru mēs ļoti detalizēti aplūkojām mūsu vietņu izveidošanas rokasgrāmatā, jums dažu minūšu laikā būs pieejama ievērojama vietne..

            HTML resursi

            • HTML periodiskā tabula – tajā ir uzskaitīti visi HTML tagi periodiskās tabulas veidā, padarot tos viegli iemācīties / lietot.
            • W3skolas / tagi – Visu HTML tagu saraksts, kas sakārtoti alfabēta secībā.
            • Mozilla / HTML attiecināts – Visu HTML atribūtu saraksts, kas sakārtoti alfabēta secībā.
            • HTML apkrāptu lapu
            • HTML krāsu kodi / krāsu nosaukumi – 140 HTML krāsu nosaukumu saraksts, ieskaitot HEX kodu, RGB vērtību un HSL vērtību.

            Jeffrey Wilson Administrator
            Sorry! The Author has not filled his profile.
            follow me