Шрифти і тексти в css
Тепер же ми розберемо, як працювати зі шрифтами і текстами в CSS.
Ясна річ, що буває необхідно, щоб в будь-якому з блоків текст був певного кольору, або щоб він був жирним. Буває потрібно призначити для певного блоку тип і розмір шрифту, колір тексту і інші параметри. Все це можна зробити за допомогою CSS. Для початку розберемося з однією річчю. Текстів властивості CSS можуть бути присвоєні двома способами: за ознакою блоку і за ознакою тега (це не офіційні терміни, а мої вони легкі для запам'ятовування).
Присвоєння властивостей CSS тексту за ознакою блоку здійснюється так само, як і присвоєння інших властивостей в правило для блоку записується ряд потрібних властивостей з потрібними значеннями:
Присвоєння властивостей CSS тексту за ознакою тега здійснюється трохи по-іншому. Зверніть увагу на перше правило в вашому файлі style.css:
Як задати тип шрифту в CSS
За замовчуванням, якщо не вказано тип шрифту, браузер відображає текстовий вміст блоку шрифтом Times New Roman. Однак ми можемо змінити такий хід подій і призначити тип шрифту самостійно.
Давайте зараз призначимо тип шрифту для блоку content-area допишіть виділене властивість:
Врахуйте одну особливість: якщо назва типу шрифту складається з одного слова, то пишеться без лапок. Якщо воно складається з двох і більше слів, то необхідно записувати його в одинарних лапках (можна і в подвійних):
Можна організувати підтримку декількох типів шрифтів для цього потрібно задати їх в CSS, перераховуючи через кому:
З цим зрозуміло. Йдемо далі.
Як задати розмір шрифту в CSS
Щоб задати розмір шрифту в CSS, нам потрібно вписати в правило властивість font-size з потрібним значенням:
Зберігаємося і переглядаємо нашу сторінку в браузері розмір шрифту змінився на 12 пікселів. Як зробити жирний шрифт в CSS
Це теж дуже просто. Допишемо властивість font-weight зі значенням bold:
Як бачите, після додавання цього властивості в CSS шрифт змінюється на жирний. Для отримання курсиву потрібно змінити значення з bold на italic або bold italic спробуйте зробити це самостійно. Як змінити колір тексту в CSS
Щоб змінити колір тексту в CSS, допишемо властивість color, присвоївши йому значення white:
Зберігаємося і дивимося на білий шрифт це теж подужали. Кольори можна привласнювати будь-які, як за допомогою системи нумерації квітів в HTML, так і просто за назвою.
Як бачите, список властивостей в наших правилах поповнився на кілька штук. Ви можете самостійно поміняти їх значення і подивитися, як це відбивається на нашій сторінці index.html.
(Visited 457 times, 1 visits today)