Выкарыстанне тэксту-Водступ нерухомасці і прылеглых да іх Sibling селектараў
Добры вэб - дызайн часта аб добрай друкарні. Паколькі так шмат ўтрымання вэб-старонкі прадстаўлены як тэкст, будучы ў стане стыль, што тэкст, які будзе адначасова прывабным і эфектыўным з'яўляецца важным навыкам, каб мець у якасці вэб-дызайнера. На жаль, у нас няма такога ж узроўня друкарскага кантролю ў Інтэрнэце, што мы робім у друкаваным выглядзе. Гэта азначае, што мы не можам заўсёды надзейна стыль тэксту на вэб-сайце такім жа чынам, што мы маглі б зрабіць гэта ў друкаваным кавалку.
Адзін агульны стыль абзаца , які вы бачыце часта ў друку (і якія мы можам узнавіць онлайн), дзе першы радок гэтага пункта водступам адну ўкладку прастору . Гэта дазваляе чытачам ўбачыць, дзе адзін абзац пачынаецца і заканчваецца іншы.
Вы не бачыце гэты візуальны стыль, як шмат на вэб-старонках, так як браўзэры, па змаўчанні, адлюстраванне пунктаў з прасторай пад імі, як спосаб паказаць, дзе канчаецца адно і пачынаецца, але калі вы хочаце, каб стыль старонкі, каб мець, што друкарак натхнёны водступу стылю на абзацы, вы можаце зрабіць гэта з дапамогай ўласцівасці стылю тэксту водступ.
Сінтаксіс гэтага ўласцівасці проста. Вось як вы б дадаць тэкставы водступ усіх параграфаў ў дакуменце.
р {тэкст-водступаў: 2em; }Настройка водступаў
Адзін са спосабаў, вы можаце пазначыць дакладна абзацы водступу, вы можаце дадаць клас да пунктаў, якія вы хочаце з водступам, але гэта патрабуе, каб рэдагаваць кожны пункт, каб дадаць клас да яго. Гэта неэфектыўна і ня варта HTML кадавання лепшых практыкаў.
Замест гэтага, вы павінны ўлічваць пры водступы абзацаў. Вы водступы абзацаў, якія непасрэдна варта за іншы пункт. Каб зрабіць гэта, вы можаце выкарыстоўваць прылеглую селектар роднасны. З дапамогай гэтага перамыкача вы выбіраеце кожны пункт, які непасрэдна папярэднічае іншы пункт.
р + р {тэкст-водступаў: 2em; }Так як вы водступ першага радка, вы таксама павінны пераканацца, што вашыя пункты не маюць ніякага дадатковага прасторы паміж імі (які з'яўляецца браўзэр па змаўчанні). Стылістычна, вы павінны альбо мець прастору паміж пунктамі або водступу першага радка, але не абодва.
р {краі дна: 0; абіўка-дно: 0; } Р + р {маржа-топ: 0; абіўка-топ: 0; }адмоўныя водступы
Вы таксама можаце выкарыстоўваць тэкставы водступ ўласцівасць, нароўні з адмоўным значэннем, каб выклікаць пачатак чаргі , каб пайсці налева , а не направа , як звычайны водступ. Вы можаце зрабіць гэта, калі радок пачынаецца з двукоссямі, так што двукоссе з'яўляецца ў невялікім полі злева ад абзаца і самі літары па-ранейшаму ўтварае добрае выраўноўванне па левым краі.
Скажам, напрыклад, што ў вас ёсць пункт, які з'яўляецца нашчадкам цытаты, і вы хочаце, каб ён адмоўна водступу. Вы маглі б напісаць гэты CSS:
BLOCKQUOTE р {тэкст-водступаў: -.5em; }Гэта дало б пачатак абзаца, які меркавана ўключае ў двукоссі адкрыцця, каб быць трохі зрушана налева, каб стварыць вісучую пунктуацыю.
Што тычыцца Поля і водступы
Oftentimes ў вэб - дызайне, выкарыстанні палёў або водступаў значэння для перамяшчэння элементаў і стварыць пустую прастору. Гэтыя ўласцівасці не будуць працаваць для дасягнення водступу абзаца эфекту, аднак. Калі ўжыць любы з гэтых значэнняў у пункце, увесь тэкст гэтага пункта, у тым ліку ў кожнай радку, будзе знаходзіцца на адлегласці, а не толькі на першай лініі.