Text-Indent Property və bitişik qardaş seçiciləri istifadə
Yaxşı veb dizayn tez-tez yaxşı tipoqrafiya haqqında. Bir veb-səhifənin məzmununun çoxu mətn olaraq təqdim edildiyi üçün mətnin cəlbedici və effektiv olması ücün stil yaratmaq bir web dizaynı sahibi olmaq üçün vacibdir. Təəssüf ki, biz çapında etdiyimiz online tipografik nəzarətin səviyyəsinə malik deyilik. Bu, həmişə bir mətndə belə bir şey edə biləcəyi şəkildə eyni şəkildə veb saytdakı mətnləri etibarlı şəkildə tərtib edə bilməməyimiz deməkdir.
Çətinliklə tez-tez çap etdiyiniz bir ümumi paraqraf üslubu (və onlayn olaraq yenidən yarada bilərik) bu bəndin birinci xəttinin bir nişan boşluğunun girildiyi yerdir. Bu, oxuculara bir paraqrafın harada başlandığını və bir başqa bitməni görmək imkanı verir.
İnternet səhifələrində bu vizual üslubu çox görmürsünüz, çünki brauzerlər, default olaraq, birinin bitdiyi və başqa birinin başlanğıcını göstərmək üçün bir yol kimi boşluqlarını göstərən paraqrafları göstərə bilərlər, ancaq bu səhifəni çap etdirmək üçün bir stil yaratmaq istəyirsinizsə, paraqraflarda ilham verilmiş üslub tərzi, mətn indent stil mülkiyyəti ilə bunu edə bilərsiniz.
Bu əmlak üçün sintaksis sadədir. Sənəddə olan bütün bəndlərə bir mətn indentini necə əlavə edəcəyiniz.
p {text-indent: 2em; }Girintilərin fərdiləşdirilməsi
Paragrafları girintili olaraq tam olaraq təyin edə biləcəyiniz bir yolu, indented istədiyiniz paraqraflara bir sinif əlavə edə bilərsiniz, ancaq bunun üçün hər bir paraqrafı bir sinif əlavə etmək üçün düzəliş etmək tələb olunur. Bu səmərəsizdir və HTML kodlaşdırma ən yaxşı təcrübələrinə uyğundur.
Bunun əvəzinə, paraqrafları girərkən hesab etməlisiniz. Birbaşa başqa bir paraqrafa əməl edən paraqrafları girin. Bunun üçün bitişik qardaş seçicini istifadə edə bilərsiniz. Bu seçici ilə, başqa bir paraqrafın əvvəlində olan hər bir paraqrafı seçirsiniz.
p + p {text-indent: 2em; }İlk satırınızı indenting olduğundan, paraqraflarınızın aralarında boşluqları olmadığı üçün (brauzerin default olduğu) əmin olun. Stilist olaraq, ya paraqraflar arasında boşluq və ya ilk satırı girin, həm də ikincilik etməməlidir.
p {margin-bottom: 0; padding-bottom: 0; } p + p {margin-top: 0; padding-top: 0; }Mənfi cəhətlər
Bir xəttin başlanğıcına sola getmək normal bir girinti kimi sağa qarşı çıxmasına səbəb olmaq üçün, mətn indent əmlakını mənfi bir dəyərlə birlikdə istifadə edə bilərsiniz. Bir xətt, qiymət xətti paraqrafın solunda ən az sərhəddə görünsə və məktublar özləri hələ də gözəl bir sol hizalama təşkil edərsə, bir xətt tirajla başlayır.
Məsələn, bir blokun bir nüsxəsi olan bir paraqrafınız olduğunu və bunun mənfi cəhətdən indented olmasını istəyirik. Bu CSS yaza bilərsiniz:
blockquote p {mətn indent: -5em; }Bu, ehtimal ki, asma nöqtə yaratmaq üçün sola bir qədər köçürülməsi üçün açılış quote xarakterini ehtiva edən bəndin başlanğıcını verəcəkdir.
Margins və Padding ilə əlaqədar
Çox vaxt web dizaynında elementləri hərəkət etdirmək və ağ boşluq yaratmaq üçün margin və ya padding dəyərlərindən istifadə edirsiniz. Bununla belə, bu xüsusiyyətlər indented paraqraf effektinə nail olmaq üçün işləməyəcəkdir. Əgər bu dəyərlərdən hər hansı birini tətbiq etsəniz, hər bir xətt daxil olmaqla, həmin bəndin bütün mətni yalnız birinci xəttin yerinə aralıq olacaqdır.