Размяшчэнне элементаў на вэб-старонцы мае важнае значэнне для яго агульнай канструкцыі. Хоць ёсць і іншыя спосабы паўплываць на макет, напрыклад, каб выкарыстоўваць табліцы ( якія мы не рэкамендуем ), то лепш за ўсё выкарыстоўваць CSS .
Ніжэй мы разгледзім, як выкарыстоўваць простую CSS стыль рядного ўласцівасць выраўноўвання малюнкаў, табліцы, параграфы, і многія іншыя.
Заўвага: Гэтыя ж метады могуць быць выкарыстаны на знешнія табліцы стыляў таксама , але так як яны прымяняюцца да асобных элементаў і , верагодна , павінны заставацца такім чынам, лепш за ўсё выкарыстоўваць у лініі кладкі , як тое , што апісана ніжэй.
Выраўноўванне абзацаў тэксту
Гэты тэг з'яўляецца першым месцам, каб пачаць выкладваючы сваю вэб-старонку. Гэта адкрыццё і закрыццё тэгаў выглядаць наступным чынам:
<Р>выраўноўванне тэксту па змаўчанні ў абзацы ў левай частцы старонкі, але вы таксама можаце выраўнаваць пункты справа і ў цэнтры.
<Р стыль = "плаваць: права;">Выкарыстоўваючы ўласцівасць паплаўка дазваляе выраўноўваць абзацы справа ці злева ад бацькоўскага элемента. Любыя іншыя элементы ўнутры гэтага бацькоўскага элемента будзе цячы вакол плавае элемента.
Для таго, каб атрымаць лепшы эфект з абзацам, то лепш усталяваць шырыню на пункце, якое менш элемента кантэйнера (бацькоў).
<Р стыль = "плаваць: злева; шырыня: 150px;">Выраўноўванне тэксту ўнутры Paragraphs
Можна сцвярджаць, што самае цікавае выраўноўванне абзаца тэксту «апраўдае», які паведамляе браўзэру, каб адлюстраваць тэкст выраўнаваны, па сутнасці, як з правага і левага боку акна.
Для таго, каб апраўдаць тэкст у абзацы, можна выкарыстоўваць тэкст выраўноўвання ўласцівасці.
<Р стыль = "выраўноўвання тэксту: апраўдаць;">Вы таксама можаце выраўнаваць ўвесь тэкст ўнутры абзаца да правай ці левай (па змаўчанні), з дапамогай тэкставага выраўноўвання ўласцівасці.
<Р стыль = "выраўноўвання тэксту: справа;">Ўласцівасць выраўноўвання тэксту будзе выраўнаваць тэкст ўнутры элемента. Тэхнічна, гэта не мяркуецца выраўноўвання малюнкаў, якія ўтрымліваюцца ўнутры абзаца ці іншага элемента, але большасць браўзэраў разглядаць выявы ў якасці ўбудаванай для гэтага ўласцівасці.
выраўноўванне малюнка
Выкарыстоўваючы ўласцівасць паплаўка на тэгу выявы вы можаце вызначыць размяшчэнне малюнкаў на старонцы і як тэкст будзе абгарнуць вакол іх.
Гэтак жа, як у пунктах вышэй, ўласцівасць паплавок стыль тэга малюнка будзе пазіцыянаваць малюнак на старонцы і кажа браўзэру, як тэкст і іншыя элементы вакол гэтай выявы патоку.
Тэкст пасля вышэй тэг выявы абгарнуць вакол малюнак направа, як малюнак адлюстроўваецца ў левай частцы экрана.
Калі я хачу, каб тэкст спыніць обцяканьне малюнка, я выкарыстоўваю яснае ўласцівасць:
style = "clear: left"
Юстировка больш, чым Пункты
Аднак, што калі вы хочаце, каб выраўнаваць больш, чым проста абзац ці малюнак? Можна проста паставіць ўласцівасць стылю ў кожным пункце, але ёсць тэг можна выкарыстоўваць, што з'яўляецца больш эфектыўным:
Проста атачаюць тэкст і малюнкі ( у тым ліку HTML - тэгі ) з дапамогай тэга і ўласцівасці стылю (флоат або выраўноўвання тэксту) і ўсё ў тым , што падзел будзе выраўнаваны , як вы хацелі б яго.
Майце на ўвазе, што будуць выкананыя выраўноўвання дададзены ў пунктах або малюнкаў у межах дзялення, перакрываючы тэг.