Simbolo ng espasyo sa html. Gumagamit ng mga whitespace na character upang i-format ang HTML code, non-breaking space at iba pang espesyal na character (mnemonics)

hello, mahal na mga mambabasa blog site! Ang mga may oras na maging pamilyar dito kahit sa mababaw ay malamang na napansin na, kahit na sa pangkalahatang balangkas. Nangangahulugan ito na mayroon silang ideya kung anong mga simbolo ng HTML ang karaniwang ginagamit sa code ng dokumento.

Sa artikulong ngayon ay susubukan naming malaman kung ano ang isang puwang sa HTML at sa kung anong mga kaso ito magagamit mga character na whitespace kapag pino-format ang mismong code para sa madaling pagbabasa. Malalaman natin kung kinakailangan na gumamit ng isang hindi nasira na espasyo, at makilala din ang iba pang mga espesyal na character (o, kung tawagin din sila, mnemonics).

Sa katunayan, ipinapayo ko sa iyo na huwag pansinin ang paksa ng paggamit ng iba't ibang mga espesyal na character, dahil ito ay isang mahalagang bahagi na nagbibigay-daan sa iyo upang makumpleto ang iyong pag-aaral ng wika. hypertext markup. Sa pangkalahatan, ang impormasyong ibinigay sa publikasyong ito ay tiyak na hindi magiging kalabisan. Well, ngayon sa punto.

Mga space at whitespace na character sa HTML

Una kailangan mong gawin mahalagang tala. Ang keyboard ng computer ay may mga espesyal na susi, na nagbibigay-daan sa iyong ipatupad ang paghihiwalay ng teksto (higit pa dito sa ibaba). Gayunpaman, isang malawak na spacebar lamang ang nagbibigay ng paghihiwalay sa pagitan ng mga salita hindi lamang sa editor, kundi pati na rin sa window ng browser. May mga nuances kapag nasira ang mga linya at indenting mula sa mga gilid.

Tulad ng alam mo, ang pagpapakita ng ilang mga elemento sa isang web browser ay tinutukoy ng mga tag. Upang i-format ang teksto, ang kilalang , na nakabatay sa block, ay ginagamit. Iyon ay, ang nilalaman nito ay matatagpuan sa buong magagamit na lapad.

Upang balutin ang mga linya sa loob ng talata P, kailangan mong gumamit ng iisang tag ng BR, kung saan magagawa mo ito. Sabihin nating kailangan nating ipasok sa teksto ang ilang mga linya mula sa isang tula na ating isinusulat text editor:

Sa kabila ng katotohanan na ang mga linya ng taludtod ay matatagpuan nang tama at ang mga gitling ay ginawa sa mga tamang lugar, ang lahat ay magiging iba sa browser:


Upang makamit ang parehong display sa isang web browser window, kailangan mong magsulat ng BR sa bawat line break:

Ngayon ay nakamit na namin ang gawain at ang mga patula na linya ay ganap na ipapakita nang tama sa browser:

kaya, mga kinakailangang paglilipat nakumpleto ang mga linya. Ang isa pang tampok na kailangang tandaan dito ay ang maraming mga puwang na darating nang sunud-sunod ay ipinapakita ng web browser bilang isa. Maaari mong i-verify ito kung sa parehong editor ay susubukan mong maglagay ng hindi isa, ngunit ilang mga puwang sa pagitan ng dalawang salita at, sa pamamagitan ng pag-click sa pindutang "I-save", tingnan ang resulta sa browser.

Space, tab at line break

Talaga, kasama ang mga ito mga character na whitespace magkakilala kami sa sandaling magsimula kaming magtrabaho kasama ang teksto sa editor at i-format ito sa tamang anyo. Upang maipatupad ang gayong gawain, mayroong mga espesyal na susi, na ang bawat isa ay tumutugma sa sarili nitong karakter sa espasyo:

  • Ang Spacebar ay ang pinakamalawak na susi sa keyboard ng computer (walang label);
  • Tab - isang susi sa kaliwa na may nakasulat na "Tab" at dalawang arrow na tumuturo sa iba't ibang direksyon;
  • Line break - "Enter" key.

Gayunpaman, tulad ng sinabi ko sa itaas, ang pangwakas ninanais na resulta hindi lamang sa isang text editor, kundi pati na rin sa isang browser, nakukuha lamang namin ito kapag ginamit ang unang key. Ang lahat ng tatlong key (kabilang ang tab at line break ay kapaki-pakinabang kapag nagfo-format ng HTML code. Sabihin nating ganito ang hitsura ng isang fragment ng code sa NotePad++ (mayroong maraming impormasyon tungkol sa editor na ito) kapag ipinapakita ang lahat ng mga character na whitespace:


Nakakakuha kami ng code na madaling basahin at maunawaan salamat sa mga espasyo. Ang mga orange na arrow ay nagpapahiwatig ng mga indentasyon na ginawa gamit ang Tab key, at ang mga simbolo ng CR at LF ay nagpapahiwatig ng mga line break na ginawa gamit ang Enter key.

Tinitingnan ang mga lalagyan na nakapugad sa isa't isa, at malinaw na nakikita ang mga pagbubukas at pagsasara ng mga tag. Sa pormang ito ang code na ito madali mong i-edit. Ngayon ihambing ito sa parehong code, na walang ganitong paghahati ng teksto:

Sa parehong paraan, gamit ang mga whitespace na character, maaari ka ring magsulat Mga panuntunan sa CSS, na biswal na magmumukhang malinaw at natutunaw:


Pagkatapos mong dalhin ang lahat ng mga estilo sa isang karaniwang denominator at ganap na tapusin ang pag-edit ng file ng mga estilo, maaari mong isagawa ang pag-edit sa pamamagitan ng pag-alis ng lahat ng mga puwang mula sa code. Ito ay kinakailangan upang madagdagan , na napakahalaga kapag nagpo-promote ng isang mapagkukunan.

Mga espesyal na character (o mnemonic) sa HTML code

Ngayon tingnan natin ang mga kaso kung saan kinakailangang gamitin ang mga espesyal na character na binanggit ko sa simula ng artikulo. Espesyalista Mga HTML na character, na kung minsan ay tinatawag na mnemonics, ay ipinakilala upang malutas ang isang matagal nang problema sa mga pag-encode na lumitaw sa hypertext markup language.

Kapag nag-type ka ng text sa keyboard, naka-encode ang mga character ng wikang ginagamit mo. Sa web browser, ang nai-type na text ay ipapakita gamit ang mga font na iyong pinili bilang resulta ng reverse decoding operation.

Ang katotohanan ay mayroong maraming mga naturang pag-encode ngayon ay wala kaming layunin na pag-aralan ang mga ito nang detalyado. Ito ay lamang na ang bawat isa sa kanila ay maaaring kulang sa ilang mga simbolo, na, gayunpaman, ay kailangang ipakita. Sabihin nating naramdaman mo ang pagnanais na magsulat ng mga solong panipi o isang accent mark, ngunit ang mga icon na ito ay hindi kasama sa set.

Upang maalis ang problemang ito, isang sistema ng mga espesyal na simbolo ang ipinakilala, na kinabibilangan ng malaking bilang ng iba't ibang mnemonics. Nagsisimula silang lahat sa isang ampersand "&" at karaniwang nagtatapos sa isang semicolon na ";". Sa una, ang bawat espesyal na karakter ay may sariling digital code. Halimbawa, para sa isang hindi nasira na espasyo, na isasaalang-alang namin nang mas detalyado sa ibaba, ang sumusunod na entry ay magiging wasto:

Ngunit pagkaraan ng ilang oras, ang pinakakaraniwang mga simbolo ay itinalaga ng mga analogue ng titik (mnemonics) upang gawing mas madaling matandaan ang mga ito. Sabihin nating para sa parehong hindi nasisira na espasyo ay ganito ang hitsura:

Bilang resulta, ipinapakita ng browser ang kaukulang simbolo. Ang listahan ng mga mnemonics ay napakalaki, pinakakaraniwang ginagamit na mga espesyal na character sa HTML maaari mong matuklasan mula sa ibaba ang sumusunod na talahanayan:

simbolo code mnemonics paglalarawan
hindi nasisira na espasyo
      makitid na espasyo (en-width bilang titik n)
      malawak na espasyo (em-width bilang letrang m)
– - – en-dash (en-dash)
- — — em dash (em dash)
­ - ­ malambot na paglipat
A ́ inilalagay ang stress pagkatapos ng "stress" letter
© © copyright
® ® ® rehistradong tatak ng trademark
™ ™ ™ tanda ng trademark
º º º sibat ng Mars
ª ª ª salamin ni Venus
‰ ‰ ‰ ppm
π π π pi (gamitin ang Times New Roman)
¦ ¦ ¦ patayong tuldok na linya
§ § § talata
° ° ° degree
µ µ µ micro sign
tanda ng talata
… … … ellipsis
‾ ‾ ‾ overlining
´ ´ ´ accent mark
№ № tanda ng numero
🔍 🔍 Magnifying glass (nakatagilid sa kaliwa)
🔎 🔎 Magnifying glass (nakatagilid sa kanan)
mga palatandaan ng arithmetic at mathematical operations
× × × magparami
÷ ÷ ÷ hatiin
< < mas mababa
> > > higit pa
± ± ± plus/minus
¹ ¹ ¹ antas 1
² ² ² antas 2
³ ³ ³ antas 3
¬ ¬ ¬ negasyon
¼ ¼ ¼ isang ikaapat
½ ½ ½ isang segundo
¾ ¾ ¾ tatlong quarters
⁄ ⁄ ⁄ decimal point
− − − minus
≤ ≤ ≤ mas mababa sa o katumbas ng
≥ ≥ ≥ mas malaki kaysa o katumbas ng
≈ ≈ ≈ humigit-kumulang (halos) katumbas
≠ ≠ ≠ hindi pantay
≡ ≡ ≡ magkapareho
√ √ √ square root (radikal)
∞ ∞ ∞ kawalang-hanggan
∑ ∑ ∑ tanda ng pagbubuod
∏ ∏ ∏ marka ng trabaho
∂ ∂ ∂ bahagyang kaugalian
∫ ∫ ∫ integral
∀ ∀ ∀ para sa lahat (makikita lamang kung naka-bold)
∃ ∃ ∃ umiiral
∅ ∅ ∅ walang laman na set
Ø Ø Ø diameter
∈ ∈ ∈ nabibilang
∉ ∉ ∉ hindi nabibilang
∋ ∋ ∗ naglalaman ng
⊂ ⊂ ⊂ ay isang subset
⊃ ⊃ ⊃ ay isang superset
⊄ ⊄ ⊄ ay hindi isang subset
⊆ ⊆ ⊆ ay isang subset o katumbas ng
⊇ ⊇ ⊇ ay isang superset o katumbas
⊕ ⊕ ⊕ plus sa isang bilog
⊗ ⊗ ⊗ multiplication sign sa isang bilog
⊥ ⊥ ⊥ patayo
∠ ∠ ∠ sulok
∧ ∧ ∧ lohikal AT
∨ ∨ ∨ lohikal O
∩ ∩ ∩ intersection
∪ ∪ ∪ samahan
mga palatandaan ng pera
€ € € Euro
¢ ¢ ¢ Cent
£ £ £ Lb
¤ ¤t; ¤ Tanda ng pera
¥ ¥ ¥ Nag sign sina Yen at Yuan
ƒ ƒ ƒ Florin sign
mga marker
. simpleng marker
○ ○ bilog
· · · gitnang punto
† † krus
‡ ‡ dobleng krus
♠ ♠ ♠ mga taluktok
♣ ♣ ♣ mga club
mga puso
♦ ♦ ♦ mga brilyante
◊ ◊ ◊ rhombus
✏ ✏ lapis
✎ ✎ lapis
✐ ✐ lapis
✍ ✍ kamay
quotes
" " " dobleng quote
& & & ampersand
« « « kaliwang typographic quotation mark (herringbone quotation mark)
» » » kanang typographic na panipi (herringbone quotation mark)
‹ ‹ walang asawa quote sa sulok pagbubukas
› › solong sulok quote pagsasara
′ ′ ′ prime (minuto, talampakan)
″ ″ ″ double prime (segundo, pulgada)
‘ ‘ ‘ kaliwang itaas na solong quote
’ ’ ’ kanang itaas na solong quote
‚ ‚ ‚ kanang ibabang solong quote
“ “ “ quote-foot left
” ” ” quote paa kanang itaas
„ „ „ quote paa ibabang kanan
❛ ❛ nag-iisang English opening quotation mark
❜ ❜ solong Ingles na pansarang panipi
❝ ❝ pambungad na dobleng panipi
❞ ❞ pagsasara ng dobleng panipi
mga palaso
← ← ← kaliwang arrow
pataas na arrow
→ → → kanang arrow
↓ ↓ ↓ pababang arrow
↔ ↔ ↔ kaliwa at kanang arrow
↕ ↕ pataas at pababang arrow
↵ ↵ ↵ pagbabalik ng karwahe
⇐ ⇐ ⇐ dobleng kaliwang arrow
⇑ ⇑ ⇑ dobleng pataas na arrow
⇒ ⇒ ⇒ dobleng kanang arrow
⇓ ⇓ ⇓ dobleng pababang arrow
⇔ ⇔ ⇔ dobleng arrow pakaliwa at kanan
⇕ ⇕ dobleng pataas at pababang arrow
▲ ▲ tatsulok pataas na arrow
▼ ▼ tatsulok pababang arrow
tatsulok na kanang arrow
◄ ◄ tatsulok na kaliwang arrow
mga bituin, mga snowflake
☃ ☃ taong yari sa niyebe
❄ ❄ Snowflake
❅ ❅ Snowflake na na-sandwich ng shamrocks
❆ ❆ Matabang snowflake na may matalim na anggulo
★ ★ May kulay na bituin
☆ ☆ Blangkong bituin
✪ ✪ Walang laman na bituin sa isang punong bilog
✫ ✫ Puno ng bituin na may bukas na bilog sa loob
✯ ✯ Umiikot na bituin
⚝ ⚝ Iginuhit na puting bituin
⚪ ⚪ Gitnang bukas na bilog
⚫ ⚫ Gitnang punong bilog
⚹ ⚹ Sextile (uri ng snowflake)
✵ ✵ Eight-pointed rotating star
❉ ❉ Bituin na may mga spherical na dulo
❋ ❋ Bold eight-pointed drop-shaped star-propeller
✺ ✺ Labing-anim na puntos na asterisk
✹ ✹ Twelve-pointed na bituin
✸ ✸ Bold eight-pointed straight filled star
✶ ✶ Six-pointed filled star
✷ ✷ Eight-pointed straight filled star
✴ ✴ Eight-pointed star
✳ ✳ Eight-pointed star
✲ ✲ Bituin na may blangko ang gitna
✱ ✱ Matabang bituin
✧ ✧ Itinuro ang apat na nakatutok na bukas na bituin
✦ ✦ Pointed four-pointed filled star
⍟ ⍟ Bituin sa isang bilog
⊛ ⊛ Snowflake sa isang bilog
orasan, oras
⏰ ⏰ Panoorin
⌚ ⌚ Panoorin
⌛ ⌛ Hourglass
⏳ ⏳ Hourglass

Mga kaso ng paggamit ng ilang espesyal na character, kabilang ang hindi nasisira na espasyo at malambot na gitling

Kung napag-aralan mo na ang talahanayan ng kaunti, nakatanggap ka ng kumpirmasyon ng sinabi ko sa itaas, na upang ipakita ang lahat ng mga espesyal na character, isang digital code () o ang alpabetikong analogue nito (symbolic mnemonics) ay ginagamit, kung saan sa halip na isang set ng hash mga marka at mga numero, mga titik () ay nakasulat.

Ngayon tingnan natin kung kailan gagamitin ang mga code na ito. Sabihin nating sa isang artikulo kailangan mong magpahiwatig ng ilang HTML tag para sa mga layuning pang-impormasyon, halimbawa,

. Kung nagta-type ka ng mga anggulong bracket mula sa keyboard (at mayroong ganoong opsyon), makikita ng browser ang naturang konstruksiyon bilang pambungad na tag, at hindi bilang isang simpleng fragment ng teksto.

Samakatuwid mula sa parehong talahanayan Mga espesyal na character ng HTML kinukuha namin ang naaangkop na mga code at ang buong tala ay magiging ganito:

Bilang karagdagan, upang ipakita sa browser hindi ang ampersand sign mismo, ngunit ang pagtatalaga nito sa anyo

, kailangan mong idagdag ang code nito mula sa talahanayan:

footer

Pagkatapos ay ipapakita ng browser ang eksaktong talaan ng mga mnemonics na kailangang ilapat upang ipakita FOOTER tag. Medyo nakakalito, ngunit ang pahinang ito ay makakatulong sa iyo na magsanay aspetong ito sa pamamagitan ng pagpasok ng mnemonics para sa kaukulang mga simbolo sa field na "HTML" at gamit ang "Run" na buton, at sa "Result" na lugar na nakukuha ang resulta ng kanilang pagpapakita sa browser:


Pakitandaan na tiniyak ko na ang text ay nakabalot gamit ang nabanggit na BR tag upang ang mga character mismo ay hindi ipinapakita sa isang linya, ngunit sa isang column para sa kaginhawahan.

Mag-move on na tayo. Minsan lumitaw ang mga kumbinasyon sa teksto na hindi kanais-nais na paghiwalayin ng magkaibang linya. Sabihin nating, “1000 rubles.” magiging lohikal o iwanan ito sa nangungunang linya, o kung walang sapat na espasyo, ilipat ang buong istraktura sa isang linya sa ibaba.

Totoo ito lalo na kung gumagamit ang mga user ng mga device na may iba't ibang lapad ng screen, kabilang ang mga mobile. Sa katunayan, sa kasong ito, ang web browser ay nag-format ng teksto, na umaangkop sa mga bagong kundisyon. At kung sa mga karaniwang sukat Kung ang teksto ay lilitaw nang tama sa monitor, ang pagbabago sa mga ito ay maaaring magbago ng lahat.

Para sa mga kasong ito ay ibinigay hindi mababasag puting espasyo HTML , na nabanggit ko na. Ipaalala ko sa iyo na sa kasong ito ang space code ay ang mga sumusunod:

At kailangan itong ipasok sa pagitan ng dalawang hanay ng mga palatandaan na kailangang maiugnay:

1000 kuskusin.

Ngayon, hindi sila paghihiwalayin ng browser sa ilalim ng anumang pagkakataon, kahit na kailangan ang pag-format ng teksto upang maipakita ito nang tama.

Mayroon ding sitwasyon kapag napaka mahabang salita hindi kasya libreng espasyo at kailangan mong ilipat ang bahagi nito. Paano ko matukoy ang bagong linya sa kasong ito kung kinakailangan? Para dito mayroong espesyal na karakter ng malambot na gitling-, na kailangang ilagay sa lugar kung saan kailangang sirain ang salita:

Mahabang mahaba mahabang mahabang salita

Kung ang isang sitwasyon ay lumitaw kapag ang isang salita ay kailangang hyphenated, pagkatapos ay isang puwang ay nabuo sa lokasyon ng malambot na hyphen mnemonic, kung saan ang isang hyphen (gitling) ay lilitaw, at ang natitirang bahagi ng salita ay lilitaw sa susunod na linya sa ibaba.

Gayunpaman, muli, magiging kapaki-pakinabang na makita ang buong bagay na ito, kabilang ang mga halimbawa ng tuluy-tuloy at malambot na paglipat, sa pagsasanay:


Sa window ng editor na ito, maaari mong baguhin ang laki ng field ng pagtingin na "Resulta" sa pamamagitan ng pag-agaw sa gilid ng lugar na ito gamit ang kaliwang pindutan ng mouse at, nang hindi ito binibitiwan, i-drag ito sa kaliwa upang bawasan ang lapad. Pagkatapos ay lumitaw ang isang tunay na sitwasyon kapag nagsimulang i-reformat ng browser ang nilalaman upang maipakita ito nang tama.

At ang paglipat ay isinasagawa, na ibinigay para sa mga halimbawang inilarawan ko. Gayunpaman, ikaw mismo ay maaaring ilipat ang window ng pagtingin, palawakin at paliitin ito, at biswal na i-verify ito.

Sa pagkakataong ito, pag-uusapan natin ang tungkol sa mga HTML na whitespace na character. Sa unang sulyap, ang paksa ay tila hindi mahalaga at hindi talaga kinakailangan, ngunit nangangahas akong tiyakin sa iyo na ito ay malayo sa kaso. May mga whitespace na character sa HTML, una, isang malinaw at tinukoy na layunin, at pangalawa, isang paunang natukoy na pag-uugali. Sa tingin ko ang layunin ng mga whitespace na character sa HTML ay higit pa o hindi gaanong malinaw: ang mga character na whitespace ay pangunahing ginagamit para sa Pag-format ng HTML code, ngunit hindi lamang para dito. Ngunit sa palagay ko ay hindi malinaw ang lahat tungkol sa pag-uugali ng mga character na whitespace. Ang bagay ay pinangangasiwaan ng mga browser ang mga character na whitespace sa isang espesyal na paraan, kaya naman isinulat ko na ang mga character na whitespace ay may malinaw na tinukoy na pag-uugali.

Kaagad nating tandaan na hinahati ng HTML ang mga character na whitespace sa mga uri: HTML tab, space at line break. At ang bawat isa sa mga uri na ito ay pinoproseso ng browser sa isang espesyal na paraan, bilang karagdagan, may mga espesyal na tag sa HTML na nagsasabi sa browser kung paano pangasiwaan ang mga character na whitespace. Mula sa post na ito matututunan mo ang tungkol sa kung bakit kailangan ang mga character na whitespace sa HTML, kung anong mga uri ng mga character na whitespace sa HTML ang nahahati at kung paano pinangangasiwaan ng browser ang mga ito.

Isasaalang-alang din namin nang detalyado ang bawat isa sa mga character na whitespace nang hiwalay. Saklaw ng recording ang mga sumusunod na isyu:

  • kung paano pinangangasiwaan ng browser gaps in HTML na dokumento e at ano ang pinagkaiba ng regular na espasyo at isang non-breaking space;
  • ano ang gamit nito tab sa HTML;
  • kung paano tinatrato ng browser ang mga line break, bakit kailangan ang mga line break sa HTML at ano ang hitsura ng isang line break sa HTML?;
  • kung paano pilitin ang browser na pilitin ang isang line break;
  • at kung paano panatilihin ang lahat ng mga whitespace na character sa HTML.

Umaasa ako na ang mga verbal na paliwanag at mga halimbawa mula sa post ay makakatulong sa iyong maunawaan kung paano pinangangasiwaan ng browser ang mga character na whitespace.

Ano ang ginagamit ng mga whitespace na character sa HTML?

Sa HTML, tulad ng sa anumang wika kung saan tayo bumuo ng isang bagay, mayroong mga whitespace na character. Kaya't alisin muna natin ang tanong: Para saan ang mga whitespace na character sa HTML?? Ang sagot ay talagang napaka-simple. Ang mga whitespace na character sa HTML ay ginagamit para sa dalawang layunin. Ang unang layunin o unang layunin ng mga whitespace na character sa HTML ay i-format ang HTML na dokumento.

Sa pamamagitan ng paggamit ng whitespace ginagawa naming nababasa at nauunawaan ang HTML code para sa amin at sa iba pang mga developer. Sumang-ayon na ang code na walang whitespace ay hindi masyadong nababasa at hindi masyadong maginhawang i-edit. Ang pamantayan ng wikang HTML ay mapagparaya sa mga character na whitespace, na nangangahulugan na maaari naming gamitin ang mga ito sa isang dokumento ayon sa gusto namin, o maaari kaming magsulat ng tuluy-tuloy na code.

Ang pangalawang layunin ng mga character na whitespace sa HTML ay, maaaring sabihin, lohikal, at gumagamit kami ng mga character na whitespace upang paghiwalayin ang mga salita sa isa't isa, dahil ang mga tekstong walang mga puwang ay magiging ganap na hindi nababasa. May mga sitwasyon na hindi mo sinasadyang naglagay ng ilang puwang sa pagitan ng mga salita sa loob HTML tag at, sa kasong ito, "i-compress" ng browser ang mga puwang na ito sa isa. Sa hinaharap, titiyakin namin ito at titingnan ang isang halimbawa.

Umaasa kami na kasama Nalaman namin ang layunin ng mga whitespace na character sa HTML at ngayon makakapag-move on na tayo. Ang paksa ng whitespace ay medyo simple, ngunit mahalaga. Talaga, sa HTML walang mahirap na mga paksa at walang hindi mahalaga dahil ang HTML ay isang pamantayan na dapat sundin.

Mga uri ng mga whitespace na character sa HTML

Dahil malinaw ang lahat tungkol sa layunin ng mga character na whitespace, sulit na maunawaan ang mga uri ng mga character na whitespace. Sa HTML, at sa pangkalahatan, ang mga character na whitespace ay maaaring paghiwalayin tulad ng sumusunod: space, tab at line break. Mahusay na ilarawan ang mga character na whitespace sa mga salita, ngunit gusto kong makita ang mga ito sa aking sariling mga mata, na makakatulong sa amin dito, na may pag-highlight ng syntax, ngunit ngayon ay mahalaga para sa amin na ang Notepad++ ay maaaring magpakita ng mga character na whitespace.

Bigyang-pansin ang larawan: ito ay isang screenshot mula sa Notepad++, na binuksan mula sa post kung saan napag-usapan natin . Orange na arrow - ito ay isang tab sa isang HTML na dokumento. Dahil nagpapatakbo ako ng Windows 10, Ang mga line break sa HTML ay ipinapakita ng dalawang character: CR at LF(Ito ay isang tradisyon na nagmumula sa mga makinilya, sa pamilya ng OS Linux port ang mga linya ay ipinahiwatig ng simbolong LF). Ngunit ang space bar sa Notepad++ ay ipinapakita bilang isang simbolo ng pulang tuldok kung titingnan mong mabuti ang screenshot, mapapansin mo ito.

Kaya, Tinulungan kami ng Notepad++ na makita ang mga whitespace na character sa isang HTML na dokumento: tab, line break at space. Gayunpaman, hindi namin makikita ang karamihan sa mga character na ito sa whitespace HTML na pahina, na bubuo ng browser para sa amin. Nasabi na namin na ang HTML ay whitespace insensitive, at itinatapon ng mga browser ang lahat ng whitespace sa pagitan ng mga tag.

Nais din naming ituon ang iyong pansin sa katotohanan na ang bawat karakter ng whitespace ay kumukuha ng espasyo sa iyong hard drive ang laki ng isang character na whitespace sa HTML ay depende sa pag-encode ng dokumento. Samakatuwid, kung nagba-browse ka at sinusubukan mong bawasan ang bilis ng paglo-load ng site, pagkatapos ay sa pagho-host maaari mong subukang alisin ang lahat ng mga character na whitespace sa pagitan ng , sa gayon ay binabawasan ang laki ng dokumento.

Space at non-breaking space sa HTML

Tingnan natin ngayon ang bawat isa sa mga character na whitespace nang paisa-isa. Magsimula tayo sa mga puwang sa HTML. Kaya, alam na natin na binabalewala ng browser ang lahat ng mga character na whitespace sa pagitan ng mga tag. Ngunit paano pinangangasiwaan ng browser ang whitespace sa loob ng mga tag? mahalagang tanong, dahil tinutukoy nito kung paano ipapakita ang mga teksto sa pahina. Tingnan natin ito sa isang halimbawa. Buksan ang anumang editor na maginhawa para sa iyo, maaari ka ring gumamit ng isang regular na notepad, ngunit inirerekumenda ko sa iyo, na may mahusay na mga kakayahan para sa pagtatrabaho sa HTML, at i-type ang sumusunod na code:

I-save ang file gamit ang .html extension sa anumang folder na maginhawa para sa iyo at buksan ito sa browser, makikita mo ang larawang ito:

Nakita namin na sa unang HTML na talata ay "na-convert" ng browser ang lahat dagdag na espasyo at mga character na whitespace maliban sa espasyo sa isang solong espasyo. Ngunit sa ikalawang talata ay medyo naiiba ang aming sitwasyon. Dito ginagamit namin ang isang espesyal na karakter, na madalas na sinasabi na non-breaking space sa HTML. Ang bagay ay hindi ganap na tama ang pagsasabi ng isang non-breaking space sa HTML, dahil ito ay isang espesyal na pagkakasunud-sunod ng pag-encode.

Mga hindi nakakasira na espasyo sa mga HTML na dokumento, tulad ng sa anumang iba pang dokumento, ay ginagamit upang sabihin ang program na bubukas dokumentong ito(sa aming kaso sa browser) na ang mga salitang ito ay hindi mapaghihiwalay na konektado ng isang puwang, sa madaling salita, kung isusulat namin ang "Hello world!", kung gayon ang browser ay hindi kailanman ililipat ang salitang "mundo!" nang walang salitang "Hello" sa isang bagong linya, ang pagbabalot ay isasagawa lamang nang magkasama. Plus lahat ng iba pa maaaring gamitin ang non-breaking space sa HTML upang maglagay ng ilang puwang sa pagitan ng mga salita sa loob ng mga HTML tag.

Bigyang-pansin ang larawan na nagpapakita ng window ng browser: binalewala ng browser ang lahat ng mga line break, sa kabila ng katotohanan na gumamit kami ng hindi nasira na espasyo sa loob ng HTML tag

Ibuod natin: binabalewala ng browser ang lahat ng mga whitespace na character sa labas ng mga HTML tag, at nag-compress ang browser lahat ng mga whitespace na character sa loob ng mga HTML tag hanggang sa isang espasyo, kung hindi ginagamit ang isang hindi nakakasira na espasyo sa loob ng HTML tag.

HTML na tab o ibang space character

Ang HTML na tab ay isa pang whitespace na character. Kadalasan, ang mga tab sa HTML ay ginagamit upang i-format ang HTML code sa editor. Ang mga tab ay hindi dapat gamitin sa loob ng isang HTML tag. 

Na pag-uusapan natin sa susunod.  Ang bagay ay ang tabulasyon ay walang nakapirming laki.  Maaaring isaayos ang laki ng tab sa parehong editor at sa browser.  Samakatuwid, imposibleng sabihin nang eksakto kung paano ipapakita ang tabulasyon para sa isang partikular na user sa .


Maaaring i-customize ang tabulation sa HTML (at hindi lamang sa HTML), dahil kinakatawan nito ang ilang puwang na pinagsama-sama.  Upang magsulat ng character na space tab, pindutin ang Tab key (sa tingin ko ito ay gagana sa anumang editor).  Maaaring gamitin ang tabulation sa HTML upang i-format ang code (huwag malito ang pag-format ng code sa direktang pag-format ng text sa HTML), ngunit hindi ito dapat gamitin sa loob ng mga HTML tag, dahil ipapakita ito para sa bawat user alinsunod sa kanyang mga setting, at samakatuwid ay naiiba. .  Malamang nasabi na namin ang lahat ng aming makakaya gamit ang mga tab sa mga HTML na dokumento at editor.


HTML line break o third space character.  Linya ng character


Line break sa HTML, at hindi lamang sa HTML, ay ginagawa sa pamamagitan ng pag-click Ipasok ang mga susi. Linya ng character sa mga operating room Linux system: LF.  Sa mga operating room Mga sistema ng Windows CR LF, V Mac system OS bago ang bersyon siyam, ang line break na character ay ang sequence CR.  So alam na natin yan Binabalewala ng browser ang mga line break sa HTML na dokumento, saanman sila matatagpuan.


Line break sa HTML pangunahing ginagamit para sa pag-edit at pag-format ng code upang gawin itong nababasa at madaling i-edit, huwag pabayaan ang pagkakataong maglagay ng line break upang gawing mas madaling basahin ang code para sa iyong sarili at sa mga taong nagtatrabaho sa iyo.


Paano gumagawa ang browser ng mga line break


Kaya, nalaman na namin kung paano binibigyang kahulugan ng browser ang mga character na whitespace at, sa prinsipyo, nagpasya para sa ating sarili ang tanong kung ano ang mga character na whitespace: tab, space, non-breaking space, line break, kailangan namin para i-format ang code para mabasa ito.  Ngunit hindi namin sasabihin ang buong katotohanan kung hindi namin pinag-uusapan kung paano sinisira ng browser ang mga linya kapag wala itong sapat na viewport.


Ang bagay ay para sa browser, ang mga space na character ay mga alituntunin kung saan ito ay tumutukoy kung paano ibalot ang mga linya sa kaso kapag hindi posible na magkasya ang mga ito sa lugar ng pagtingin.  Subukan nating ipatupad ang isang simpleng halimbawa.  Lumikha tayo simpleng HTML dokumento.  Buksan ang anumang maginhawang editor, halimbawa, at isulat ang sumusunod na code:

 
 




Whitespace sa HTML




Ang tekstong nakasulat nang walang mga puwang ay hindi ililipat


Gumagamit ang browser ng whitespace para maputol ang mga linya kapag hindi sapat ang laki ng viewing area para magkasya sa buong linya.








 


 
<
!
DOCTYPE
html
>

<
html
lang
=
"ru-RU"
>

<
head
>

<
meta
charset
=
"UTF-8"
>

<
title
>Mga character na whitespace sa HTML<
/
title
>

<
link
rel
=
"stylesheet"
type
=
"text/css"
href
=
"style.css"
/
>

<
/
head
>

<
body
>

<
h1
>Ang tekstong nakasulat nang walang mga puwang ay hindi ililipat<
/
h1
>

<
p
>Gumagamit ang browser ng mga character na whitespace upang isagawa ang pagbabalot
mga linya sa kaso kung saan walang sapat na lugar sa pagtingin
magkasya sa buong linya<
/
p
>

<
/
body
>

<
/
html
>




At pagkatapos ay buksan ang halimbawa sa browser at bawasan ang lugar ng pagtingin sa isang minimum, makikita mo ang humigit-kumulang sa parehong larawan tulad ng sa figure sa ibaba.




Sa kaso ng HTML header, ang browser ay hindi nag-wrap ng anuman at iniwan ang linya kung ano ang dati.  Ngunit sa kaso ng isang HTML na talata, ang browser ay may pag-unawa na paano magbalot ng mga linya dahil sa katotohanan na ang teksto ng talata ay naglalaman ng mga character na whitespace, kung saan nakatutok ang browser upang magsagawa ng isang line break.


Kaya nakahanap na kami tatlong gamit ng whitespace sa HTML: ang una at pangunahing isa ay ang mga whitespace na character ay ginagamit upang i-format ang code, ang pangalawang application ay ang browser, na tumutuon sa mga whitespace na character, ay gumagawa ng mga line break kapag wala itong sapat na viewport, at ang pangatlong paggamit ng mga whitespace na character sa HTML ay lahat tungkol sa paghihiwalay ng mga salita sa teksto.


Sapilitang line break sa HTML.  HTML tag 




Kaya, nalaman namin na ang browser bumahing sa mga line break sa HTML, ngunit ano ang dapat nating gawin kung kailangan nating putulin ang linya kung saan natin gusto, at hindi kung saan nagtatapos ang viewport sa browser?  Halimbawa, gusto naming mag-publish ng mga tula, ngunit ang paglalathala ng mga ito sa mga talata ay hindi masyadong tama at hindi maginhawa.  Sa ganitong mga sitwasyon, ang HTML tag ay nagliligtas sa amin at nagliligtas sa amin nang husto. 
.


Si BR ay maliit na titik na HTML elemento at isang tag ng HTML.  Nagsasagawa ng HTML tag 
isang simpleng isa, ngunit mahalagang tungkulin – pinipilit na maputol ang linya.  Kapag nakita ng browser ang HTML tag 
, bumubuo ito ng HTML element na nakikita ng mga user bilang isang line break.  Gumawa tayo ng sapilitang linya break gamit ang isang halimbawa, buksan ang anumang editor na maginhawa para sa iyo, sa aking opinyon ang isa sa mga pinaka maginhawang mga editor ay , at kopyahin ang sumusunod na code:

 
 




Whitespace sa HTML




Puting birch 
Sa ibaba ng aking bintana 
Natatakpan ng niyebe 
Saktong silver.








 


 
<
!
DOCTYPE
html
>

<
html
lang
=
"ru-RU"
>

<
head
>

<
meta
charset
=
"UTF-8"
>

<
title
>Mga character na whitespace sa HTML<
/
title
>

<
link
rel
=
"stylesheet"
type
=
"text/css"
href
=
"style.css"
/
>

<
/
head
>

<
body
>

<
p
>Puting Birch<
br
>Sa ilalim ng aking bintana<
br
>

Tinakpan ang aking sarili ng niyebe,<
br
>Saktong silver.<
/
p
>

<
/
body
>

<
/
html
>




Ang quatrain mula sa gawa ni Yesenin ay ipapakita tulad ng sumusunod:




Bawat linya ng tula ay nakasulat na may bagong linya, sa prinsipyo, ito ang aming pinagsikapan.  Kaya, i-tag 
ginagamit para sa force line breaks sa HTML.  Kung magsusulat ka ng dalawa o higit pang mga tag ng BR nang magkasunod, bubuo ang browser ng kasing dami ng sapilitang mga break na linya gaya ng may mga tag. 
magkikita siya sa dokumento.


Isang mahalagang katangian ng tag 
ay ang lahat ng mga character na whitespace na matatagpuan sa code bago ito at lahat ng mga character na matatagpuan pagkatapos nito ay binabalewala.  Samakatuwid, ligtas kang makakagawa ng forced line break gamit ang tag na ito, nang walang takot na ang isang extrang white space na character ay "gagapang palabas" sa isang lugar.  Ito ay nagkakahalaga ng noting na ang tag 
may isang malinaw na nagsasabi sa browser kung paano pangasiwaan ang susunod 
linya kung ang teksto ay bumabalot sa isang lumulutang na elemento ng HTML, ngunit pag-uusapan natin iyon sa isa pang post.


Pagpapanatili ng whitespace sa HTML.  HTML tag 


Ngayon talakayin natin ang problema ni Vladimir Mayakovsky... Mas tiyak, ang kanyang istilo, mas tiyak, paano natin maisusulat ang mga tula ni Vladimir Mayakovsky sa isang HTML na dokumento.


Kailangan ba talaga nating gumamit ng mga espesyal na HTML na character, tulad ng isang hindi puwang na puwang at pagkatapos ng bawat linya ng isang tag 
?  Sagot: syempre hindi.  Isinasaalang-alang ng mga developer ng pamantayang HTML ang puntong ito at pinagtibay ito sa pamantayan espesyal na HTML tag 
. Tag 
O ang preformatted ay maaaring isalin sa Russian bilang pag-format ng may-akda.


Pinapayagan ng tag na ito panatilihin ang mga whitespace na character sa HTML.  Kapag nakatagpo ang browser ng text sa loob ng isang tag 
Ipinapakita nito kung ano man, iyon ay, pinapanatili ang lahat ng mga character na whitespace: ang mga line break, mga tab at mga puwang lamang ang ise-save sa loob ng tag 
Ang paraan ng pagsulat mo sa kanila.


Ito ay nagkakahalaga ng noting na ang HTML tag 
Ay ipinares, at ang HTML PRE element ay block-level.  Sa totoo lang, tinawag ang tag na pag-format ng may-akda dahil sa kadahilanang sinabi namin sa itaas: sine-save ng browser ang lahat ng mga white space na character ng teksto sa loob ng tag na ito sa anyo kung saan isinulat ng may-akda ang mga ito.  Subukan natin panatilihin ang lahat ng mga whitespace na character sa HTML, gamit ang tag 
At tingnan natin kung paano ipapakita ang mga whitespace na character sa browser.




Ang code ng dokumento ay napaka-simple, ang taludtod ni V. Mayakovsky ay inilagay sa isang lalagyan 
Ngayon tingnan natin Paano pinangangasiwaan ng browser ang mga character na whitespace sa loob? HTML na elemento PRE.




Nakikita namin na ang lahat ng mga whitespace na character ay napanatili sa anyo na isinulat namin sa kanila.  Ngayon natiyak namin na ang tag 
Talagang pinapanatili ang mga whitespace na character sa mga pahina ng HTML.


Kaya, ibubuod natin ang lahat ng nasa itaas. May tatlong uri ng mga whitespace na character sa HTML: tab, line break, at space.. Tab sa HTML Dapat lamang gamitin upang i-format ang HTML code sa editor. Mga line break sa HTML binabalewala sila ng mga browser, "pini-compress" sila sa isang espasyo, tulad ng mga tab.  Para gumawa ng line break sa HTML, gamitin ang tag 
.


Mga puwang sa HTML ay kailangan para sa dalawang layunin: ang browser ay gumagamit ng mga puwang upang matukoy kung paano masira ang mga linya ay kailangan upang gawing nababasa ang teksto.  Sinusuportahan ng HTML ang mga espesyal na encoding na character, hal. non-breaking space character sa HTML ay maaaring gamitin kapag gusto mong magsulat ng maramihang mga puwang sa isang hilera (kung hindi, ang browser ay puputulin ang mga ito sa isa) o sa code na gusto mong sabihin sa browser na huwag ibalot ang mga salita sa mga bagong linya nang wala ang isa't isa.


Kumusta, mahal na mga mambabasa ng blog site.  Medyo mas maaga, nagawa na naming pag-usapan iyon, at natutunan din ang tungkol sa disenyo dito.  Ngayon ay mayroon na tayong konsepto ng white space sa HTML, pati na rin ang nauugnay na pag-format ng code kapag isinusulat ito (para sa kaginhawahan ng kasunod na pagbabasa at pang-unawa nito).
Buweno, dahil sa katotohanan na tatalakayin natin ang paksa ng hindi nakakasira na espasyo at malambot na hyphenation, kakailanganin nating ituon ang ating pansin sa tinatawag na mga espesyal na character o mnemonics na ginagamit sa wikang Html, na magbibigay-daan sa iyong magdagdag web code Ang dokumento ay may maraming karagdagang mga simbolo, tulad ng mga nabanggit na sa itaas.  Ngunit una sa lahat.
Mga space at whitespace na character sa HTML
Bago lumipat sa isyu ng pag-format ng text gamit ang mga tag na espesyal na idinisenyo para dito (talata, heading, atbp.), gusto kong pag-isipan kung paano binibigyang-kahulugan ang mga puwang, line break (Enter) at tabulation sa wikang HTML, at kung paano ang breaking ay nagsagawa ng teksto sa window ng browser kapag na-resize ito.
Totoo, para sa ganitong uri ng visual na pag-format (na hindi makikita sa web page), kadalasan ay hindi ang mga puwang mismo ang ginagamit, ngunit sa halip ang mga tab at line break na character.  Mayroong ganoong panuntunan - kapag nagsimula kang magsulat ng isang nested HTML tag, Iyon indent gamit ang mga tab (Tab key sa keyboard), at kapag isinara mo ang tag na ito, alisin ang indentation (key kumbinasyon Shift+Tab sa keyboard).
Dapat itong gawin upang ang pagbubukas at pagsasara ng mga tag ay nasa parehong vertical na antas (sa parehong bilang ng mga tab mula sa kanang gilid ng pahina sa iyong Html editor, halimbawa, Notepad++, na isinulat ko).  Bilang karagdagan, ipinapayo ko sa iyo na kaagad pagkatapos isulat ang pambungad na elemento ay gumawa ng ilang mga break na linya at agad na isulat ang pagsasara sa parehong antas (bilang ng mga tab), upang hindi mo makalimutang gawin ito sa ibang pagkakataon.
Yung.  ang mga elemento ng pagbubukas at pagsasara ay dapat na nasa parehong antas nang patayo, at ang mga panloob na tag ay dapat ilipat ng isang tab na character at ang mga elemento ng pagsasara at pagbubukas ay dapat ilagay muli sa parehong antas.
Para sa simpleng web mga dokumento na ito ay maaaring mukhang tulad ng overkill, ngunit kapag gumagawa ng higit pa o hindi gaanong kumplikado, sila ang code ay magiging mas malinaw at nababasa dahil sa kasaganaan ng mga espasyo, at magiging mas madaling makita ang mga error dahil sa simetriko na pagkakaayos ng mga tag.
Mga espesyal na character o mnemonic sa HTML code
Kaya, ngayon pag-usapan natin ang tinatawag na mga espesyal na karakter, ang kadalian ng paggamit na inihayag ko sa simula ng artikulong ito.  Ang mga espesyal na karakter ay tinatawag ding mnemonics o substitutions.  Ang mga ito ay nilayon upang malutas ang isang problema na lumitaw sa hypertext markup language sa loob ng mahabang panahon, na nauugnay sa mga pag-encode na ginamit.
Kapag nag-type ka ng text sa keyboard, ang mga character ng iyong wika ay naka-encode ayon sa isang paunang natukoy na algorithm, at pagkatapos ay ipapakita ang mga ito sa site gamit ang mga font na iyong ginagamit (kung saan mahahanap at kung paano i-install para sa site) dahil sa pag-decode.
Mayroong maraming mga pag-encode, ngunit para sa Html na wika ang pinalawig na bersyon ng mga pag-encode ay pinagtibay bilang default.
Sa pag-encode ng tekstong ito, posible na magsulat lamang ng 256 na mga character - 128 mula sa ASCII at isa pang 128 para sa mga titik na Ruso.  Bilang resulta, nagkaroon ng problema sa paggamit sa mga site ng mga character na hindi kasama sa ASCII at hindi mga letrang Ruso na kasama sa Mga pag-encode ng Windows 1251 (CP1251).  Buweno, nagpasya kang gumamit ng isang tilde o isang kudlit, ngunit ang gayong mga posibilidad ay likas sa wikang ginamit HTML encoding hindi sinangla.
Para sa mga ganitong kaso na naimbento ang mga pagpapalit o, sa madaling salita, mga mnemonic.  Sa una may mga espesyal na karakter digital view mga tala, ngunit pagkatapos ay para sa mga pinaka-karaniwan ang kanilang mga katapat na liham ay idinagdag upang gawing mas madaling matandaan ang mga ito.
SA pangkalahatang pag-unawa, ang mnemonic ay isang karakter na nagsisimula sa isang ampersand "&" at nagtatapos sa isang semicolon na ";".  Ito ay tiyak para sa mga kadahilanang ito na ang browser Pag-parse ng HTML kinukuha ng code ang mga espesyal na character mula dito.  Ang ampersand sa isang numeric na wildcard code ay dapat na sundan kaagad ng isang pound sign na "#", kung minsan ay tinatawag na hash.  At pagkatapos lamang sumunod sa digital code ng nais na character sa Unicode encoding.
Mahigit sa 60,000 character ang maaaring isulat sa Unicode - ang pangunahing bagay ay ang mnemonic na simbolo na kailangan mo ay sinusuportahan ng font na ginamit sa iyong site.  May mga font na sumusuporta sa halos lahat ng mga Unicode na character, at may mga opsyon lamang na may isang tiyak na hanay ng mga character.
Ang buong listahan ng mga espesyal na character ay magiging napakalaki, ngunit pinakakaraniwang ginagamit na mnemonics maaari kang humiram halimbawa mula sa talahanayang ito:
SimboloHTML codeDecimal 
code		Paglalarawan




hindi nasisira na espasyo

 

 
 
makitid na espasyo (en-width bilang titik n)

 

 
 
malawak na espasyo (em-width bilang letrang m)

–
-
–
en-dash (en-dash)

-
—
—
em dash (em dash)

­
-
­
malambot na paglipat

A
́
ang stress ay inilalagay pagkatapos ng "stress" na sulat

©

©
copyright

®
®
®
rehistradong tatak ng trademark

™
™
™
tanda ng trademark

º
º
º
sibat ng Mars

ª
ª
ª
salamin ni Venus

‰
‰
‰
ppm

π
π
π
pi (gamitin ang Times New Roman)

¦
¦
¦
patayong tuldok na linya

§
§
§
talata

°
°
°
degree

µ
µ
µ
micro sign

tanda ng talata

…
…
…
ellipsis

‾
‾
‾
overlining

´
´
´
accent mark

№

№
tanda ng numero

🔍

🔍
Magnifying glass (nakatagilid sa kaliwa)

🔎

🔎
Magnifying glass (nakatagilid sa kanan)

mga palatandaan ng arithmetic at mathematical operations

×
×
×
magparami

÷
÷
÷
hatiin

<
<

mas mababa

>
>
>
higit pa

±
±
±
plus/minus

¹
¹
¹
antas 1

²
²
²
antas 2

³
³
³
antas 3

¬
¬
¬
negasyon

¼
¼
¼
isang ikaapat

½
½
½
isang segundo

¾
¾
¾
tatlong quarters

⁄
⁄
⁄
decimal point

−
−
−
minus

≤
≤
≤
mas mababa sa o katumbas ng

≥
≥
≥
mas malaki kaysa o katumbas ng

≈
≈
≈
humigit-kumulang (halos) katumbas

≠
≠
≠
hindi pantay

≡
≡
≡
magkapareho

√
√
√
square root (radikal)

∞
∞
∞
kawalang-hanggan

∑
∑
∑
tanda ng pagbubuod

∏
∏
∏
marka ng trabaho

∂
∂
∂
bahagyang kaugalian

∫
∫
∫
integral

∀
∀
∀
para sa lahat (makikita lamang kung naka-bold)

∃
∃
∃
umiiral

∅
∅
∅
walang laman na set

Ø
Ø
Ø
diameter

∈
∈
∈
nabibilang

∉
∉
∉
hindi nabibilang

∋
∋
∗
naglalaman ng

⊂
⊂
⊂
ay isang subset

⊃
⊃
⊃
ay isang superset

⊄
⊄
⊄
ay hindi isang subset

⊆
⊆
⊆
ay isang subset o katumbas ng

⊇
⊇
⊇
ay isang superset o katumbas

⊕
⊕
⊕
plus sa isang bilog

⊗
⊗
⊗
multiplication sign sa isang bilog

⊥
⊥
⊥
patayo

∠
∠
∠
sulok

∧
∧
∧
lohikal AT

∨
∨
∨
lohikal O

∩
∩
∩
intersection

∪
∪
∪
samahan

mga palatandaan ng pera

₽

₽
Ruble.  Ang ruble sign ay dapat gamitin kasabay ng numero.  Unicode 7.0 na pamantayan.  Kung hindi mo nakikita ang larawan, i-update ang iyong mga Unicode font.

€
€
€
Euro

¢
¢
¢
Cent

£
£
£
Lb

¤
¤
¤
Tanda ng pera

¥
¥
¥
Nag sign sina Yen at Yuan

ƒ
ƒ
ƒ
Florin sign

mga marker


.

simpleng marker

○

○
bilog

·
·
·
gitnang punto

†

†
krus

‡

‡
dobleng krus

♠
♠
♠
mga taluktok

♣
♣
♣
mga club




mga puso

♦
♦
♦
mga brilyante

◊
◊
◊
rhombus

✏

✏
lapis

✎

✎
lapis

✐

✐
lapis

✍

✍
kamay

quotes

"
"
"
dobleng quote

&
&
&
ampersand

«
«
«
kaliwang typographic quotation mark (herringbone quotation mark)

»
»
»
kanang typographic na panipi (herringbone quotation mark)

‹

‹
pambungad na quote sa isang sulok

›

›
solong sulok quote pagsasara

′
′
′
prime (minuto, talampakan)

″
″
″
double prime (segundo, pulgada)

‘
‘
‘
kaliwang itaas na solong quote

’
’
’
kanang itaas na solong quote

‚
‚
‚
kanang ibabang solong quote

“
“
“
quote-foot left

”
”
”
quote paa kanang itaas

„
„
„
quote paa ibabang kanan

❛

❛
nag-iisang English opening quotation mark

❜

❜
solong Ingles na pansarang panipi

❝

❝
pambungad na dobleng panipi

❞

❞
pagsasara ng dobleng panipi

mga palaso

←
←
←
kaliwang arrow




pataas na arrow

→
→
→
kanang arrow

↓
↓
↓
pababang arrow

↔
↔
↔
kaliwa at kanang arrow

↕

↕
pataas at pababang arrow

↵
↵
↵
pagbabalik ng karwahe

⇐
⇐
⇐
dobleng kaliwang arrow

⇑
⇑
⇑
dobleng pataas na arrow

⇒
⇒
⇒
dobleng kanang arrow

⇓
⇓
⇓
dobleng pababang arrow

⇔
⇔
⇔
dobleng arrow pakaliwa at kanan

⇕

⇕
dobleng pataas at pababang arrow

▲

▲
tatsulok pataas na arrow

▼

▼
tatsulok pababang arrow




tatsulok na kanang arrow

◄

◄
tatsulok na kaliwang arrow

mga bituin, mga snowflake

☃

☃
taong yari sa niyebe

❄

❄
Snowflake

❅

❅
Snowflake na na-sandwich ng shamrocks

❆

❆
Matabang snowflake na may matalim na anggulo

★

★
May kulay na bituin

☆

☆
Blangkong bituin

✪

✪
Walang laman na bituin sa isang punong bilog

✫

✫
Puno ng bituin na may bukas na bilog sa loob

✯

✯
Umiikot na bituin

⚝

⚝
Iginuhit na puting bituin

⚪

⚪
Gitnang bukas na bilog

⚫

⚫
Gitnang punong bilog

⚹

⚹
Sextile (uri ng snowflake)

✵

✵
Eight-pointed rotating star

❉

❉
Bituin na may mga spherical na dulo

❋

❋
Bold eight-pointed drop-shaped star-propeller

✺

✺
Labing-anim na puntos na asterisk

✹

✹
Twelve-pointed na bituin

✸

✸
Bold eight-pointed straight filled star

✶

✶
Six-pointed filled star

✷

✷
Eight-pointed straight filled star

✴

✴
Eight-pointed star

✳

✳
Eight-pointed star

✲

✲
Bituin na may blangko ang gitna

✱

✱
Matabang bituin

✧

✧
Itinuro ang apat na nakatutok na bukas na bituin

✦

✦
Pointed four-pointed filled star

⍟

⍟
Bituin sa isang bilog

⊛

⊛
Snowflake sa isang bilog

orasan, oras

⏰

⏰
Panoorin

⌚

⌚
Panoorin

⌛

⌛
Hourglass

⏳

⏳
Hourglass

Mayroong medyo kawili-wili paraan ng pagkuha HTML code mnemonic para sa tanda na kailangan mo.  Upang gawin ito, ito ay sapat na upang buksan Microsoft editor Salita, lumikha bagong dokumento at pumili mula sa tuktok na menu"Insert" - "Simbolo" (Gumagamit ako ng 2003 na bersyon, kaya hindi ko alam kung paano gumawa ng katulad na operasyon sa mga susunod na bersyon).
Sa window na bubukas, kailangan mong pumili ng font, halimbawa, Times New Roman (o anumang iba pang malinaw na makikita sa karamihan ng mga computer ng iyong mga bisita sa site - Courier o Arial, halimbawa).
Idagdag mula sa listahang nagbubukas sa iyo Word na dokumento lahat ng mga espesyal na character na kailangan mo at i-save ang Word document na ito bilang isang web page (pinili mula sa drop-down na listahan ng ".html" kapag nagse-save).  Well, kung gayon ang kailangan mo lang gawin ay buksan ang web page na ito sa alinman HTML editor(ang parehong Notepad++ ang gagawin) at makikita mo ang lahat mga digital code mnemonics na kailangan mo:
Ang pamamaraan ay medyo kumplikado, ngunit kung gusto mong gumamit ng ilang bihirang espesyal na karakter sa iyong pahina ng website, kung gayon ito ay magiging mas madali kaysa sa paghahanap sa Internet para sa mga talahanayan tulad ng ipinakita sa itaas.  Kakailanganin mong i-paste ang nagreresultang espesyal na code ng character sa tamang lugar at sa halip na ito sa web page, ipapakita ng browser ang karakter na kailangan mo (halimbawa, isang hindi puwang na puwang).
Non-breaking space at soft hyphen sa mga halimbawa
Tulad ng nabanggit ko na sa itaas at tulad ng makikita mo mula sa talahanayan ng mga espesyal na character na ibinigay sa itaas, ang ilang mga mnemonic sa Html ay nakatanggap, bilang karagdagan sa digital, isang simbolikong pagtatalaga para sa kanilang higit pa. simpleng pagsasaulo.  Yung.  Sa halip na hash sign na “#” (hash), ginagamit ang mga salita sa mga simbolikong variant.  Halimbawa, ang parehong non-breaking space ay maaaring isulat alinman bilang (digital mnemonic) o bilang (character).
Kapag nagsusulat ng mga artikulo, kung kailangan mong maglagay ng ampersand (&) o open angle bracket (<), то для этого обязательно нужно использовать спецсимволы. Дело в том, что эти знаки в Html означают начало тега и браузер будет рассматривать их именно с этой точки зрения и отображать в тексте не будет.
Iyon ay, kung nagsusulat ka ng isang artikulo kung saan kakailanganin mong magpasok, halimbawa, isang tag na display sa teksto< body>o kailangan mo lang magpasok ng mas mababa sa sign (<), то сделав это без использования подстановок на веб странице вы ничего не увидите, т.к. браузер, обнаружив «<» , поймет, что это Html тег, а не текст статьи.
Samakatuwid, kakailanganin mong ipasok ang sumusunod na konstruksiyon upang malutas ang isang katulad na problema:
Ang parehong naaangkop sa pagpapakita ng code ng mnemonics mismo, dahil nagsisimula sila sa isang ampersand.  Kakailanganin mong ipasok ang code sa teksto, palitan ang ampersand sign sa pagpapalit nito (espesyal na karakter):
 
Ito ay kailangang gawin upang makapasok sa pahina<, а не отображение левой угловой скобки (<), в которую преобразует браузер мнемонику <, обнаружив при разборе знак амперсанда. Хитро, но вы все поймете попробовав это на практике.
Malamang na gagamit ka rin ng hindi nasisira na espasyo, na magmumukhang isang regular na espasyo sa isang web page, ngunit hindi ito ituturing ng browser bilang isang space character at ay hindi magsasagawa ng mga paglilipat dito(halimbawa, ito ay magiging angkop para sa mga parirala tulad ng 1400 GB, atbp., na hindi maipapayo na maglagay ng gitling sa iba't ibang linya):
1400 GB.
Minsan ang kabaligtaran na sitwasyon ay maaaring lumitaw, kapag ang teksto ay naglalaman ng napakahabang salita at nais mong tiyakin na, kung kinakailangan, ang browser Kaya kong basagin ang mga salitang ito gamit ang hyphenation.  Para sa mga naturang layunin, ang isang espesyal na simbolo na "soft transfer" ay ibinigay -
Isang mahaba, mahabang salita;
Kapag kinailangan nang lumipat sa ibang linya, gagamit ang browser ng gitling sa halip na ang malambot na hyphen mnemonic at ipapadala ang natitirang salita sa susunod na linya.  Kung mayroong sapat na espasyo upang ilagay ang buong salita sa isang linya, hindi magguguhit ng anumang bagong linya ang browser.  Ganun kasimple.
 
Good luck sa iyo!  Magkita-kita tayo sa mga pahina ng blog site
Maaari kang manood ng higit pang mga video sa pamamagitan ng pagpunta sa
");">
Baka interesado ka
MailTo - ano ito at kung paano lumikha ng isang link sa Html upang magpadala ng isang Email 
Mga tag at katangian ng mga heading H1-H6, horizontal line Hr, line break Br at talata P ayon sa pamantayan ng Html 4.01 
Paano magpasok ng isang link at isang larawan (larawan) sa HTML - IMG at A tag


Binubuo ang typewritten text ng mga naka-print na character - mga graphic na simbolo. 
Ang mga graphic na simbolo ay mga simbolo na may nakikitang display sa teksto. 
Ang lahat ng mga graphic na simbolo ay kinokolekta sa isang set ng isang unicode system. 
Magpasok ng isang Unicode graphic na simbolo sa isang html na dokumento 
- ang pangunahing at tanging layunin para sa talahanayang ito.


Maaari kang magpasok ng isang simbolo sa isang HTML na dokumento sa isa sa mga sumusunod na paraan:
  1. kopyahin ang imahe ng simbolo mula sa window ng browser patungo sa window ng iyong visual html editor
    2. 

  2. kopyahin ang html code ng simbolo nang direkta sa code ng html na dokumento
    3. 

 Mangyaring maunawaan na ang mga ito ay dalawang magkaibang pamamaraan: 
  1. ipasok ang visual sa visual
    2. 

  2. ipasok ang code sa code.
    3. 

Ang font para sa isang simbolo, ang laki at kulay nito sa HTML ay maaaring itakda gamit ang code tulad ng: 
 CHARACTER_CODE 
saan, 
Arial - font, 
10px - laki ng font sa mga pixel, 
#ff0000 - code ng kulay ng font (pula)
Halimbawa: 
☎ - laki ng font ng character na 30px, 
☎ - laki ng font ng simbolo 30px, kulay - pula 
☎ - laki ng font ng character na 20px, 
☎ - laki ng font ng simbolo na 10px. 
Tandaan  Ang mga inirerekomendang font para sa paglalagay ng mga espesyal na character ay Arial, Verdana at Tahoma.  Ang mga font na ito ay nagpapakita ng mga Unicode na character nang tama at ang kanilang mga sarili ay wastong sinusuportahan ng mga web application.
  1. "Simbolo"
    (nakikitang pagpapakita ng simbolo) 
    Mula sa column na ito maaari mong kopyahin ang simbolo na imahe at i-paste ito sa html text editor window.  Kokopyahin ang simbolo na may laki ng font na 20px.  Pagkatapos makumpleto ang pagkopya, maaaring kailanganin na isa-isang ayusin ang laki ng font nang direkta sa kinopyang karakter.
    2. 

  2. "Pangalan"
    (para lang sa mahahalaga o hindi malinaw na mga character) 
    Pagpapaliwanag ng layunin ng simbolo, saklaw nito, mga halimbawa...
    3. 

  3. "Mnemonics"
    Ang mnemonics ay isang alpabetikong konstruksyon ng form ", na nagsasaad ng alphabetic code ng isang character sa HTML. Ito ay direktang ipinasok sa html code ng isang html na dokumento. Ang mga mnemonic ay napakapopular sa mga propesyonal na taga-disenyo ng layout. Ang mga ito ay perpektong kabisado ng mga tao at ay sinusuportahan ng lahat ng html na application. Ang bawat mnemonics ay naglalaman ng alpabetikong pangalan (designation ) ng simbolo nito at isang service sign (&), na nagsisilbing senyales para basahin ng browser ang code at hindi ipinapakita sa screen ng monitor ng bawat mnemonic ay natatangi at madaling basahin, dahil ito ay nagmula sa salitang Ingles na nagpapakilala sa simbolo. 
    Mnemonics (Griyego) - ang sining ng pag-alala ng isang bagay.  Ang mga mnemonic ay ginagamit upang mapadali ang pang-unawa ng mahirap na isaulo na impormasyon kapag ang bagay ng pagsasaulo ay dinala sa isang estadong nauugnay sa isang bagay.
    4. 

  4. "Code"
    Code - ang numeric decimal code ng isang character sa HTML, tulad ng &.  Direktang ipinasok sa html code ng isang html na dokumento.  Ang decimal code ay binubuo ng isang numero na nagsasaad ng serial number ng character sa Unicode system at ilang service character (& at #), na nagsisilbing senyales para basahin ng browser ang code at hindi ipinapakita sa monitor screen.  Ang numerical decimal code ay malawakang ginagamit at ginagamit dahil sa versatility at kadalian ng perception.
    5. 

Kontrolin ang mga character sa HTML (XHTML)


Ang mga control character sa HTML (XHTML) ay mga service character ng HTML na wika na ginagamit sa HTML na layout ng isang web page.  Dapat suportahan ng anumang browser ang mga character na ito, dahil kung wala ang mga ito imposibleng maipakita nang tama ang HTML na teksto.  Ang mga control character ay hindi ipinapakita sa text at, kapag direktang ipinasok mula sa keyboard, ay binibigyang-kahulugan ng browser bilang mga bantas na humihiling ng ilang aksyon na isasagawa kapag ang pahina ay iginuhit sa screen.


Pinapayagan na gumamit ng mga control character sa mga ordinaryong teksto, kung saan sinasagisag nila ang mga unibersal na konsepto at binibigyang-kahulugan ng browser bilang mga ordinaryong typographical na character.  Kapag gumagamit ng mga simbolo ng serbisyo sa mga HTML na teksto sa ganitong paraan, hindi ang halaga ng simbolo mismo ang kailangang ipasok, ngunit ang HTML code nito.  Dahil, inuulit ko, kung hindi man ay mapapansin ng browser ang simbolo ng serbisyo bilang isang tawag sa pagkilos at hindi ipapakita nang tama ang HTML na teksto sa screen ng monitor.


Ang mga simbolo ng kontrol at ang kanilang HTML code ay kilala at nauunawaan ng lahat ng mga browser nang walang pagbubukod, na hindi masasabi, sayang, tungkol sa iba pang mga simbolo na maaaring maipakita nang hindi tama sa iba't ibang mga browser o, mas masahol pa, hindi ipinapakita sa lahat.


Syntax at bantas












espasyo ng haba N (regular na espasyo)
 

 




espasyo ng haba M (longspace)
 

 





 

 


-

malambot na gitling (hindi napi-print na character)
-

­


‑

gitling


– 
 ‑


-

gitling ng haba N (regular na gitling)
-

–


—

gitling ng haba M (em gitling)
—

—


.

tuldok


.


,

kuwit


,


…

ellipsis
…

… 
…


:

colon


:


;

tuldok-kuwit


;


!

tandang padamdam


!
ǃ


?

tandang pananong


?


@

"aso"


@


*

"bituin"


*


#

"sala-sala"


#


‘

solong itaas na kaliwang quote
‘

‘ 
‘


’

solong kanang itaas na quote
’

’ 
’


‚

solong ibabang kanang quote
‚

‚ 
‚


“

double itaas na kaliwang quote
“

“ 
“


”

double upper right quote
”

” 
”


„

double lower right quote
&bdquo
„ 
„


«

dobleng kaliwang sulok na panipi (Rus)
«

«


»

dobleng kanang sulok na panipi (Rus)
»

»


́

accent mark, halimbawa: Vasya


́


"

apostrophe, halimbawa: Ikaw"I


"


´

talamak, halimbawa: Vasya
´

´



talata (hindi mai-print na karakter)



§

talata
§

§


ˆ

accent (baligtad na ibon)
ˆ

ˆ 
ˆ


˜

maliit na tilde
˜

˜ 
˜


¦

patayong tuldok na linya
¦

¦


(
kaliwang panaklong


(

)

tamang panaklong


)


〈

kaliwang angle bracket
〈

〈


〉

kanang anggulo bracket
〉

〉


‹

kaliwang anggulo bracket, opsyon
‹

‹


›

kanang anggulo bracket, opsyon
›

›


[

parisukat na bracket sa kaliwa


[


]

square bracket sa kanan


]


/

slash - slash character


/


\

backslash


\


⁄

slash (sign ng dibisyon)
⁄

⁄


ǀ

patayong bar


ǀ


ǁ

dobleng patayong bar


ǁ


‾

overlining, halimbawa: Vasya‾vasya
‾

‾


¯

macron, halimbawa: Vasya¯vasya
¯

¯


Mga trademark at pera


+

plus
+

+


−

minus
−

-
−


=

katumbas


=


±

plus o minus
±

±


×

tanda ng pagpaparami
×

×


÷

tanda ng dibisyon
÷

÷


⋅

dot operator (gitna ng linya)
⋅

· 
⋅


∗

asterisk operator (gitna ng linya)
∗

∗


∼

operator ng tilde
∼

∼


.

list marker (gitna ng linya)
.

• 


¹

superscript "1"
¹

¹


²

superscript "2"
²

²


³

superscript "3"
³

³


Superscript at subscript sa HTML (XHTML) 
maaaring ipasok gamit ang mga tag At , ayon sa pagkakabanggit: 
NUMBER Superscript→ NUMBER Superscript 
NUMBER Subscript→ NUMBER Subscript		

½

fraction "isang kalahati"
½

½


⅓

fraction "isang ikatlo"


⅓


¼

fraction "one-fourth"
¼

¼


¾

fraction "tatlong quarters"
¾

¾


№

tanda ng numero


№


%

porsyento


%


‰

ppm
‰

‰ 
‰


°

digri
°

°


′

prime (minuto, talampakan)
′

′


″

double prime (segundo, pulgada) 
Halimbawa 1: 30° 25′ 12″ 
Halimbawa 2: 25′ 12 ″



″

″


µ

micro
µ

µ


π

Pi
π

π


ƒ

sign ng function 
(hindi malito sa "integral")		
ƒ

ƒ 
ƒ


∫

integral
∫

∫


∅

tumawid sa zero, walang laman na hanay 
(hindi dapat ipagkamali sa "diameter")		
∅

∅


⌀

diameter (hindi malito sa ekis na Latin na “o”)


⌀


ø

Latin na "o" ang pahilis na naka-cross out
ø

ø


Ø

Ang Latin na kapital na "O" ay pahilis na naka-cross out
Ø

Ø


∏

marka ng trabaho
∏

∏


∑

tanda ng pagbubuod
∑

∑


√

radikal 
(square root o x root)		
√

√


∝

proporsyonal
∝

∝


∞

kawalang-hanggan
∞

∞


∠

sulok
∠

∠


⊥

orthogonal (patayo)
⊥

⊥


∴

lagdaan ang "samakatuwid"
∴

∴


≅

humigit-kumulang pantay
≅

≅


≈

halos pantay
≈

≈


≠

hindi pantay
≠

≠


≡

magkapareho
≡

≡


≤

mas mababa sa o katumbas ng
≤

≤


≥

mas malaki kaysa o katumbas ng
≥

≥


∧

lohikal AT
∧

∧


∨

lohikal O
∨

∨


⊕

plus sign sa isang bilog 
(direktang halaga)		
⊕

⊕


⊗

multiplication sign sa isang bilog 
(cross product, arrow mula sa observer)		
⊗

⊗


ʘ

tuldok sa isang bilog 
(arrow sa tagamasid)		


ʘ








































































































































































































































































































✵
✵






























    





        

    
 

    
MGA KAUGNAY NA ARTIKULO