TechCodeview

Beveik kiekvienos svetainės, kurią randame ir naudojame žiniatinklyje, struktūra buvo sukurta naudojant HTML – standartizuotą tekstinių failų skirstymo į kategorijas sistemą. Puslapių lūžiai, pastraipos, stiprios raidės, kursyvas ir kitos funkcijos pridedamos naudojant HTML. Naudodamas žymas, kurios nurodo naršyklėms, kaip tvarkyti turinį, HTML padeda sukurti šią struktūrą.

Pavyzdžiui, tarp žymų strong>bold/strong> įdėtume žodį, kad jis atrodytų paryškintas. Pradinė žyma (/) nurodo, kur norime, kad paryškintas šriftas baigtųsi, o pirmoji žyma (/) nurodo, kur norime pradėti paryškintą šriftą. Jis naudojamas kaip daugumos tinklalapių pagrindas. Taigi, tai yra vieta, kur pradėti, jei mokotės koduoti.

Kaip pridėti vietos HTML

Be vieno tarpo tarp žodžių, į visus tuščius tarpus, kuriuos įvedame HTML tekste, kad būtų rodomas naršyklėje, neatsižvelgiama. Dėl to turime užprogramuoti norimas tuščias vietas savo dokumente. Bet kurioje teksto eilutėje HTML gali būti pridėta vietos. Pavyzdžiui, lentelės ir pastraipos turinyje galime įterpti tuščių tarpų naudodami HTML objektą . Kadangi HTML trūksta klaviatūros raidės tuščiai vietai, turime įvesti objektą, kad pridėtume kiekvieną tarpą.

Tai gali atrodyti paprasta, bet pridėti vietos prie HTML gali būti sudėtinga. Yra mažiausiai penki skirtingi požiūriai, kaip tai pasirūpinti.

Per šiuos mokymus matysime daug atvejų. Taip pat bus parodyta, kaip panaudoti sudėtingesnes erdvės formas.

kaip blokuoti youtube skelbimus android

Visa tai įmanoma naudojant paprastą HTML, nenaudojant CSS. Tačiau atminkite, kad pridėti vietos prie HTML geriausia naudojant CSS.

Kaip atrodo ASCII erdvė?

Erdvė žymima ASCII simboliu 20. Tačiau tai tik priimta praktika.

Yra penkių skirtingų tipų erdves, kurias galite naudoti HTML. Jie atrodo identiški neįgudusiai akiai, nors turi šiek tiek skirtingas funkcijas.

Kita parinktis yra tabuliavimo simbolis, imituojantis klaviatūros tabuliavimo klavišo paspaudimą. Kitas pavyzdys yra karietos grąžinimo simbolis, imituojantis klaviatūros klavišo įvedimo paspaudimą.

Nelūžtanti erdvė:

Kosmose:  

Em erdvė:  

Plona erdvė:

Standartinė erdvė:

Nauja eilutė (grįžta):

Skirtuko simbolis:

Kairėje pusėje yra charakteris , o dešinioji pusė reiškia HTML kodas.

Kiek plotis yra veikėjas erdvėje?

Tarpo simboliams yra keturi standartiniai pločiai:

Standartinio pločio erdvė:Kadangi tai nesukels eilutės pertraukos (taip pat žinomas kaip vežimo grįžimas), tai taip pat žinoma kaip „ne eilučių laužymo tarpas“.Em tarpas:Tai pavadinta „Em“, nes bet kokiu šriftu, kurį naudojate, jis yra tokio pat pločio kaip raidė M. (Jei girdėjome apie frazę „em-dash“, žinome, apie ką kalbame.)Kosmose:Tai žinoma kaip „En“, nes jos plotis toks pat kaip n raidė jūsų šrifte.Plona erdvė:Siauriausia iš visų erdvių yra „plona erdvė“, kuri yra paskutinė galimybė.

Ką reiškia erdvės ženklas HTML?

yra plačiausiai naudojamas HTML objektas.

masyvo sąrašas java

Kad šis tekstas užpildytų erdvę, pabandykite jį mesti.

Pavyzdžiui, įsivaizduokime, kad norime po frazės pridėti du tarpus, tačiau svetainės atvaizdavimo variklis pats pašalina vieną iš tarpų. Norėdami pridėti du tarpus, galime įvesti

Tarpas: kas tai?

Simboliai, kurie nematomi, vadinami tarpais. Jie susideda iš:

1. erdvės,
2. skirtukai ir
3. eilučių lūžiai (karietos grįžimas, eilučių tiekimas arba abu),

Kodėl tai labai svarbu?

Pavyzdžiui, šios raidės nėra matomos teksto rengyklėje, tačiau jos turi įtakos teksto erdvei ir formatavimui. Naršyklė sujungia daugybę tarpų simbolių į vieną HTML tarpą, kuris skiriasi nuo kitų žymėjimo kalbų.

Šiame HTML yra keli tarpai tarp žodžių, o kiekviena eilutė baigiasi CRLF (carriage return, linefeed) simboliais. Naršyklė sutrauks visus tarpo simbolius.

Pavyzdys

Geriems dalykams reikia daugiau laiko.

Išvestis:

Tarpų įterpimas

1. Norėdami suteikti daugiau tarpų, naudokite teksto nepertraukiamą tarpo ženklą ( ).
2. CSS užpildymo ypatybė gali būti naudojama norint padidinti erdvę elemento viduje įvairiomis aplinkybėmis.
3. CSS paraštės atributas leidžia pridėti papildomos vietos aplink elementą.

Nors nepertraukiami tarpai yra naudingi, jų nereikėtų naudoti per daug, nes tai gali trukdyti medžiagai rodyti naršyklėse. Be to, nenaudokite nepertraukiamų tarpų stiliaus tikslais, pvz., įtraukdami arba centruodami elementą tinklalapyje; Vietoj to, stilistiniai reikalavimai turėtų būti tvarkomi naudojant CSS.

Be objekto, HTML taip pat palaiko šiuos papildomus objektus daugeliui gretimų tuščių tarpų:

Simbolių objektas   naudojamas tarpai pavaizduoti. En yra matavimo vienetas, atitinkantis 8 pikselius arba pusę em (16 pikselių) pločio.

Tarpo tarp turinio sintaksė yra   Štai pavyzdys, kaip naudoti HTML &ensp objektą:

Čia yra erdvės subjekto pavyzdys.

Išvestis:

Objektas   naudojamas anksčiau pateiktame pavyzdyje tarpams pridėti prie HTML, o jo plotis yra 8 pikseliai. Jie taip pat gali būti naudojami keliose gretimose vietose.

Formatavimo ir tarpų palaikymas

Jei norite išlaikyti nurodytą formatavimą ir tarpus, yra du pasirinkimai:

1. HTML formatavimo ir vietos pridėjimas
2. Naudojant a

    tag.

„Pre“ žymos naudojimas

Šie rezultatai atsiranda pakeitus

žyma

 tag:

Pavyzdys

 pre> Good things take more time 

Išvestis:

dinaminis programavimas

Taip,

 tag keeps the formatting as it was originally, but it also switches to a monospaced typeface. All of these can be fixed; however, using the <pre> tag isn&apos;t always the best option. HTML spacing is a more popular method.</pre>

HTML formatavimo ir vietos pridėjimas

Kaip alternatyvą galime įtraukti HTML elementus ir simbolius, tokius kaip:

Geri dalykai bus

skirti daugiau laiko.

Išvestis:

Reikalingas eilutės lūžis
elementas.

Nelūžtanti erdvė:

Naršyklė nesutraukia tarpų, pridėtų su nepertraukiamu tarpo simboliu ().

Be to, kaip rodo pavadinimas, naršyklė neleidžia suskaidyti dviejų žodžių.

Geriems dalykams reikia daugiau laiko.

Išvestis:

Šiame modelyje teksto pradžioje pridedama 10 tarpų. Kitas yra tarp ' paima “, kuris nebus izoliuotas, kai sakinys bus baigiamas dėl erdvės apribojimų.

Padding Atributas

Elemento vidinė erdvė padidinama naudojant CSS užpildymo atributą.

Jo reikšmės svyruoja nuo vienos iki keturių, prasidedančios viršuje, dešinėje, apačioje ir dešinėje.

The 'div' elementas turi 20 pikselių paminkštinimą iš visų pusių.

tokios svetainės kaip coomeet

 Inner spacing is 20px with a div attribute 

Išvestis:

Maržos atributas

1. Naudojant CSS paraštės atributą, aplink elementą pridedama papildomos vietos.
2. Jo reikšmės svyruoja nuo vienos iki keturių, prasidedančios viršuje, dešinėje, apačioje ir dešinėje.

The 'div' elementas turi 40 pikselių paraštę iš visų pusių.

 Outer spacing is 20px using the div and margin attribute 

Išvestis:

Padding vs Margin

1. Užpildymas ir paraštė padidina elemento erdvę.
2. Paminkštinimas palieka tuštumą, kuri laikoma elemento komponentu.
3. Krašto sukurta erdvė laikoma esančia už elemento ribų.
4. Šis variantas turi įtakos paspaudimo regionui, fono spalvoms ir kitiems svetainės atributams.

Galima patikėti, kad tarpų pridėjimas HTML yra taip paprasta, kaip nuolatinis tarpo klavišo paspaudimas. Bet viskas veikia ne taip. Paspaudus tarpo klavišą daugiau nei vieną kartą, šalia esančių tuščių tarpų nebus pridėta, kaip būtų teksto dokumente. Naršyklė sujungs visas šalia esančias tuščias vietas į vieną, jei tai padarysime HTML. Norėdami parodyti, kas nutinka, kai HTML naudojame keletą tarpų, pažiūrėkime į pavyzdį:

Taigi, daug kartų panaudoję tarpo klavišą, negalime pridėti daugiau tuščių tarpų

Išvestis:

Pakartotinai paspausdami tarpo klavišą HTML, kaip matyti anksčiau pateiktame pavyzdyje, mes bandome į tinklalapį įterpti daug tuščių tarpų iš eilės. Tačiau naršyklės pateikia kelis gretimus tuščius tarpus kaip vieną tarpą ir nepaiso tarpų prieš, po ir už komponentų ribų. Šis reiškinys žinomas kaip tarpų žlugimas. Nors tarpų sutraukimas kartais gali erzinti, yra keletas būdų, kaip pridėti daugiau tarpų tiek HTML, tiek CSS (pakopinių stilių lapuose).

&

Simbolių subjektas   naudojamas em erdvei pavaizduoti. em plotis, kuris yra 16 pikselių, yra lygus emsp.

Teksto em tarpų sintaksė yra   Štai pavyzdys, kaip naudoti HTML &emsp objektą:

Čia yra erdvės subjekto pavyzdys.

Išvestis

Objektas   naudojamas aukščiau esančiame pavyzdyje tarpams pridėti prie HTML, o jo plotis yra 16 pikselių. Jie taip pat gali būti naudojami keliose gretimose erdvėse.

&thinsp

Simbolių esybė naudojama vaizduoti ploną erdvę, dažnai vadinamą siaura erdve. Viena šeštoji em yra & plotis

kaip veikia kompiuteris

Plonas tarpas sintaksėje rašomas kaip tarpinis turinys. Štai pavyzdys, kaip naudoti HTML objektą ''

Tai yra plonos erdvės objekto pavyzdys.

Išvestis

Esybė anksčiau pateiktame pavyzdyje naudojama plonoms tarpoms pridėti prie HTML, o jo plotis yra šeštoji em. Jie taip pat naudojami keliose gretimose erdvėse.

Žemiau yra ASCII menas „Labas“. # # ##### # # # ##### # # # # # # # # # # ####

Išvestis:

Tarpo naudojimo pranašumai

Išplėstas turinio suprantamumas:Kai klientai yra mūsų svetainėje, jie turėtų turėti galimybę pamatyti, kur jie eina, kad būtų motyvuoti toliau naršyti. Tiesą sakant, tarpai tarp ištraukų ir aplink teksto bei paveikslėlių blokus padeda asmenims suprasti, ką jie žiūri, ir prisideda prie geresnės klientų patirties apskritai.Daugiau bendradarbiavimo:Ar galime būti tikri, svečiai patikimai skuba naršydami vietines vietas, o turėdami daug tarpų sustiprins ryšį užkirsdami kelią trukdžiams, kurie sulėtina svečio veiklą. Iš tiesų, net ir nedidelis daiktų amortizatorius privers pastebėti tam tikrą mūsų svetainės regioną. Remiantis „Human Elements Worldwide“ vadovaujamu tyrimu, balta erdvė padidina pažinimą praktiškai 20%.Galimybė pasiūlyti raginimą veikti (CTA):Retkarčiais aiškiausias būdas ką nors išskirti yra padaryti viską geriau. Galime padidinti paveikslėlius arba padidinti mygtukus. Nepaisant to, daikto įtraukimas tarpais gali būti taip pat naudingas.Švari svetainė prilygsta dėmesio vertai svetainei:Pradinis mūsų svetainės jausmas yra labai svarbus. Daug nepaprastai tvirtų dizainų, didelė planų įvairovė – toks didelis komponentų skaičius padidina svetainės įspūdį; tačiau tarpas yra ypač reikšmingas, nes parodo meistriškumą ir išradingumą. Dėl tarpų jūsų svetainė nerodoma ar vidutinė. Kad ir kaip būtų tinkamai panaudotas ilgas tarpas, jis suteiks jūsų svetainei blizgesio ir paplitimo.Sukurti pusiausvyrą:Per mažai tarpų sukelia netvarką, netvarką ir drebėjimą – su svetainės įvaizdžiu susijusios savybės, kurių jums nereikia. Be to, daugumoje tarpų gali trūkti turinio ir kliento nurodymų. Svarbiausia yra pakoreguoti savo planus ir leisti tarpas veikti kaip neįtikėtina priemonė atskirti turinio gabalėlius, kad būtų paprastas atvirumas ir toliau tobulinama klientų patirtis.Veikia kaip skyriklis:Tarpas išskiria nesusijusius plano komponentus. Jis paprastai naudojamas atskirti paveikslėlius ar dizainą vienas nuo kito ir veikia pagal bendrą vaizdo formatą. Teisėtas tarpas leidžia geriau suderinti mintis ir įtikinamus planus.

Kodėl tarpas yra svarbus?

Mano, kaip dizainerio, nuomone, „Whitespace“ yra pagrindinė gero dizaino sudedamoji dalis. Dizaineriai nurodo neigiamą erdvę arba erdvę tarp kompozicijos dalių, kai vartoja terminą „balta erdvė“. Tai tuščia vieta tarp grafikos, paraščių ir latakų puslapyje, kuris niekuo nepažymėtas. Akis vizualiai kvėpuoja erdvėje tarp stulpelių, teksto eilučių ir figūrų.

Yra įtikinama priežastis, kodėl tarpas yra esminis dizaino komponentas. Tai gali pakeisti mūsų svetainės dizainą ir suteikti jai keletą privalumų, jei bus tinkamai pritaikyta. Turime gaminti ir kurti maketus, kurie džiugintų akis ir skatintų skaitytojus tęsti. Labai svarbu nuolat nepamiršti, kad kuriant žiniatinkliui mūsų prioritetas yra fantastiško produkto pristatymas klientams.

Tarpas gali būti naudojamas norint nukreipti skaitytoją nuo vieno elemento prie kito, sukurti harmoniją ir pusiausvyrą bei padėti sukurti dizainą. Pagrindiniai mūsų tikslai yra padaryti, kad svetainė atrodytų nesudėtinga ir aiški, ir pateikti turinį, kuris patiks ir vertinamas mūsų vartotojams. Tarpas yra ne tik „tuščia“ vieta; tai dizaino ypatybė, leidžianti puslapio elementams egzistuoti. Teritorija išlaiko pusiausvyrą ir yra nuolatinis priminimas, kad egzistuoja gražūs dizainai. Norint perteikti aiškią žinią, mums nereikia kurti teksto ir grafikos perkrauto maketo.