Погляд на тое, як пустое прастору ў HTML апрацоўваецца браўзэрамі
Калі вы пачатковец вэб-дызайнер, адзін з многіх рэчаў, якія вы павінны будзеце зразумець на ранняй стадыі з'яўляецца спосабам, што белае прастору ў кодзе сайта з'яўляецца апрацоўваецца вэб-браўзэры.
На жаль, так што браўзэры апрацоўваюцца пробельные не вельмі інтуітыўны на першым, асабліва калі вы прыходзіце ў HTML і параўнаць яго з тым, як белым прасторай апрацоўваюцца ў праграмах апрацоўкі тэкстаў, якія вы можаце быць больш знаёмыя.
У праграме апрацоўкі тэксту, вы можаце дадаць шмат адлегласці або укладкі ў дакуменце, і што адлегласць будзе адлюстроўвацца на дысплеі змесціва дакумента. Гэта не ў выпадку з HTML або вэб-старонак. Такім чынам, навучанне, як белае прастору, на самай справе, апрацоўваюцца вэб-браўзэрамі вельмі важна.
Разнос ў друку
У праграме апрацоўкі тэкстаў, тры асноўных пробельные сімвалы з'яўляюцца прабелы, знакі табуляцыі і вяртання карэткі. Кожны з іх дзейнічаюць у выразным чынам, але ў HTML, браўзэры робяць іх усё ў асноўным тое ж самае. Калі вы змесціце адзін прабел або 100 прабелы ў вашым HTML-разметкі, або змяшаць ваш інтэрвал з укладкамі і вяртання карэткі, усе яны будуць кандэнсавацца да аднаго месца, калі старонка адлюстроўваецца ў браўзэры. У тэрміналогіі вэба-дызайн, гэта вядома як прабел калапс. Вы не можаце выкарыстоўваць гэтыя тыповыя ключы распорных дадаць прабелы ў вэб-старонку, таму што браўзэр руйнуецца некалькі прабелаў ўніз у толькі адзін прабел, калі аказваецца ў браўзэры,
Чаму Выкарыстанне Хто Укладкі?
Як правіла, калі людзі выкарыстоўваюць укладкі ў тэкставым дакуменце, яны іх выкарыстоўваюць па прычынах макета або атрымаць тэкст, каб перайсці да вызначанага месца або быць на пэўным адлегласці ад іншага элемента. У вэб-дызайне, вы не можаце выкарыстоўваць гэтыя вышэйзгаданыя прабелы для дасягнення гэтых візуальных стыляў або патрэбы макета.
У вэб-дызайне, выкарыстанне дадатковых сімвалаў распорных ў кодзе будзе чыста для зручнасці чытання гэтага кода. Вэб-дызайнеры і распрацоўшчыкі часта выкарыстоўваюць ўкладкі для водступу кода, так што яны могуць бачыць, якія элементы з'яўляюцца нашчадкамі іншых элементаў - але гэтыя водступы не ўплываюць на візуальнае размяшчэнне самой старонкі. Для тых неабходных візуальных змяненняў макета, вам трэба будзе звярнуцца да CSS (каскадныя табліцы стыляў).
Выкарыстанне CSS для стварэння HTML Укладкі і Spacing
Сайты сёння будуюцца з падзелам структуры і стылю. Структура старонкі апрацоўваецца HTML, а стыль дыктуецца CSS. Гэта азначае, што для стварэння інтэрвалу або дасягнення пэўнага макета, вы павінны быць звяртаецеся да CSS, а не спрабаваць проста дадаць Разнос знакаў у HTML код.
Калі вы спрабуеце выкарыстоўваць ўкладкі , каб стварыць калонкі тэксту, замест гэтага можна выкарыстоўваць элементы
Калі дадзеныя, якія вы выклаўшы таблічныя дадзеныя, вы можаце выкарыстоўваць табліцы для выраўноўвання, што дадзеныя, як вы хочаце. Табліцы часта атрымліваюць дрэнны рэп ў вэб-дызайне, таму што яны былі парушаныя як чыстыя размяшчэнне інструментаў на працягу многіх гадоў, але табліцы па-ранейшаму цалкам дапушчальна, калі ўтрыманне ўтрымлівае, што вышэйзгаданыя таблічныя дадзеныя.
Поля, Запаўненне і Text-Водступ
Найбольш распаўсюджаныя спосабы стварэння інтэрвалу з дапамогай CSS з'яўляецца выкарыстанне аднаго з наступных стыляў CSS:
- запас
- набіванне
- тэкст-водступаў
Напрыклад, вы можаце водступ першага радка абзаца, як ўкладкі з наступным CSS (звярніце ўвагу, што гэта мяркуе, што пункт мае атрыбут класа для «першых» прыкладаюцца да яго):
p.first {
Тэкст-водступаў: 5em;
}
Гэты пункт зараз будзе з водступам каля 5 знакаў.
Вы можаце таксама выкарыстоўваць маржынальнасць або дапаўняюць ўласцівасці ў CSS, каб дадаць інтэрвал у верхняй, ніжняй, левай ці правай (або камбінацыі гэтых бакоў) элемента. У канчатковым рахунку, вы можаце дамагчыся якога-небудзь інтэрвалу, неабходных для павароту CSS.
Перасоўванне тэксту больш аднаго прасторы без CSS
Калі ўсё, што вы хочаце для вашага тэксту, каб перамясціць больш чым адно прастору ад папярэдняга пункта, вы можаце выкарыстоўваць непарыўны прабел.
Для таго, каб выкарыстоўваць непарыўны прабел, вы проста дадаеце & NBSP; столькі разоў, колькі вам трэба яго ў HTML-разметцы.
Напрыклад, калі вы хочаце, каб перамясціць слова пяці прабелаў больш, вы можаце дадаць наступнае перад словам.
& NBSP; & NBSP; & NBSP; & NBSP; & NBSP;HTML паважае іх і ня зруйнуецца іх у адзіную прастору. Тым ня менш, гэта лічыцца вельмі дрэнны практыкай , паколькі яна дадае дадатковую HTML разметку дакумента толькі для дасягнення патрэбаў макета. Вяртаючыся да гэтага падзелу структуры і стылю, вы павінны пазбягаць дадання непарыўных прабелаў проста для дасягнення жаданага эфекту макета і павінны выкарыстоўваць CSS поля і водступы замест гэтага.