Головна буква в html і css
Заголовна буква, відповідно до визначення, - це елемент тексту, який збільшений в розмірі щодо малих літер. Практично у всіх мовах з великої літери починається пропозицію. А оформлення початку абзацу виділяється великою літерою дозволяє структурувати текст і полегшує його сприйняття. Коли оформляється інтернет-сторінка, текст може бути написаний відповідно до переваг автора і правилами російської мови. Також його оформлення можна «автоматизувати» шляхом внесення певних «команд» у файл з розширенням css - таблицю стилів - або доповнити Ваш html файл розділом style. CSS зазвичай вивчають додатково з html, щоб швидко міняти якісь елементи оформлення відразу у всьому тексті.
Це особливо актуально, якщо сайт має сотні сторінок, і вносити зміни на кожну з них є дуже трудомістким процесом.
Якщо ви застосуєте css, заголовні літери на початку кожного абзацу можуть виглядати особливим чином. Наприклад, введений в html без круглих дужок нижченаведений код дозволяє для тексту, який оформлюється тегом «р», зробити велику літеру - first letter - більш великої - 220% від стандартного розміру, жовтого кольору - значення color одно yellow, і написати її шрифтом, відмінним від решти тексту - Georgia проти batangche.
(<) style(>)
p {font-family: batangche- font-size: 93% -}
p: first-letter {font-family: Georgia- font-size: 220% - color: yellow-}
(<)/style(>)
Красиві великі літери можна отримати, якщо створити власний шрифт у вигляді картинок - на кожну букву окрема картинка, наприклад, в давньоруському або готичному стилі. Їх можна намалювати в графічному редакторі. Тоді в необхідних місцях на місце великої літери можна вставляти код без круглих дужок (<) img src="ссылка на место, где лежит картинка"(>). Додатковими атрибутами тега Img будуть heigh і width - ширина і висота зображення, яку можна встановити в пікселях для гармонійного поєднання з іншим текстом. Приклад: (<) img src="ссылка на место, где лежит картинка" heigh=12 px width=6px(>). Круглі дужки навколо < и > прибираємо.
Якщо у вас немає можливості самостійно намалювати алфавіт, то заголовна буква може бути оформлена за допомогою шрифтів, викладених у вільному доступі на "Гуглі" (розділ Fonts) або інших пошукових і ресурсах. Для цього вищенаведений код потрібно оформити наступним чином:
(<) style(>)
p {font-family: batangche- font-size: 93% -}
p: first-letter {font-family: Kelly + Slab- font-size: 220% - color: blue-}
(<)/style(>)
А в тег «head» додати посилання без круглих дужок для «підключення», де після family зазначається обраний сімейство шрифтів, підставляти, крім того, також в p: first-letter.
(<)link href='https://fonts.googleapis.com/css?family=Kelly+Slab&subset=latin,cyrillic' rel='stylesheet' type='text/css' (>).
Сервіс "Гугла" дозволяє вибрати той чи інший вид шрифту і надає готові посилання для вставки в html або css. Звертаємо вашу увагу на те, що необхідно обов'язково вибрати групу шрифтів - латиницю або кирилицю, тому майже всі латинські шрифти не працюють при оформленні російськомовного тексту. На даний момент пошуковик надає близько 40 видів російських шрифтів на безкоштовній основі.
Головна буква або її прописаний антипод можуть бути оформлені за допомогою властивості CSS text transform. Якщо в таблиці стилів встановити значення text transform: none, то текст буде виглядати так, як ви його напишете. Для переведення всіх букв в рядковий регістр потрібно через двокрапку встановити значення text transform: lowercase, а для прописні регістра - uppercase. Встановлення ж для властивості значення text transform: capitalize зробить так, що на початку кожного слова буде заголовна буква.