Ти тут

Прикраса веб-сторінки і розмір шрифту в html

Початківцям веб-дизайнерам корисно буде знати про способи оформлення тексту веб-сторінки. До них відносяться вирівнювання, колір, розмір шрифту і багато іншого.

З форматуванням пов`язані кілька тегів. Найчастіше використовується "p"- Абзац. У нього є необов`язкові параметри, що задають зовнішній вид тексту.

розмір шрифтуПерший і основний параметр - це "align". Він визначає вирівнювання тексту і може приймати значення "left", "right", "center" і "justify" -равненіе по лівій стороні, по правій, по центру і по всій ширині блоку відповідно. Зауважте, що положення тексту задається не відносно кордонів екрану, а в межах абзацу.

Далі йдуть параметри "class&rdquo- і "id". Вони визначають, до якого класу належить даний об`єкт і його ідентифікатор. Сюди ж можна віднести і атрибут "style"-він задає вбудований стиль блоку. Всі ці властивості пов`язані з CSS, мова про який піде трохи нижче.

У тега "p"є один недолік - з його допомогою можна задати зовнішній вид шрифту, наприклад, його колір або розмір. Для цих цілей призначений інший тег - "font". Всі його параметри визначають, як буде виглядати текст.

Відео: Основи HTML. Як змінити розмір тексту на інтернет-сторінці

html розмір шрифтуПерший атрибут цього тега - "color". Як ви вже здогадалися, в ньому задається колір. Цей параметр може приймати як назви ("white", "yellow", "magenta"), Так і значення в системі RGB. Це робиться так: спочатку ставиться знак #, а потім вказуються три числа в шестнадцатеричной системі числення від 00 до ff або від 0 до 255 - в десяткового - кількість червоного, зеленого і синього в кінцевому кольорі. Наприклад, для використання червоного кольору потрібно написати "# ff0000", Жовтого - "# ffff00".

Наступний атрибут - "face". Він визначає гарнітуру шрифту. Наприклад, йому можна задати значення "Times New Roman" або "Tahoma".

І, нарешті, за розмір шрифту в HTML відповідає параметр "size". Він приймає числове значення - кегль.



Наприклад, щоб вивести текст блакитним кольором і шрифтом "Comic Sans MS" п`ятнадцятого кегля, потрібно визначити тег "p" з параметрами:

color ="# 6666ff" face ="Comic Sans MS" size ="15"

розмір шрифту в htmlТакож існує кілька тегів, що дозволяють задати один конкретний вид форматування: "b" - Виділення жирним, "i" - Курсивом, "u" - Підкреслення. Всі вони не мають параметрів.

Задавати атрибути тексту в HTML - розмір шрифту, гарнітуру - досить незручно. Уявіть, що вам потрібно чергувати блоки з різним оформленням тексту. Тоді до кожного з тегів вам доведеться визначати одні і ті ж атрибути. Значно зручніше це можна реалізувати за допомогою CSS-каскадних таблиць стилів. Наприклад, щоб створити клас картинок під назвою "myclass" з таким оформленням, як в попередньому прикладі, потрібно додати в тег "style" такий рядок:



#myclass {font: rgb (102,102,255) "Comic Sans MS" 15pt-}

Відео: Оформлення елементів HTML за допомогою CSS [GeekBrains]

тут "rgb (102,102,255)" задає колір, "Comic Sans MS" - Гарнітуру, а "15pt" - розмір шрифту. Колір також можна задавати назвою, а шрифт - як в кеглях, так і в пікселях (для цього потрібно написати, наприклад, "20px").

Для застосування цього оформлення потрібно в тезі "p" написати:

class ="myclass"

Таким же способом можна оформити будь-який інший текст. Досить поставити параметр "class"зі значенням того класу, який ви хочете використовувати.

А щоб створити ідентифікатор з назвою "myid", Потрібно в "style" записати:

#myid {font: rgb (102,102,255) "Comic Sans MS" 15pt-},

а в тезі "p" задати атрибут "id" зі значенням "myid".

Клас і ідентифікатор - це практично одне і те ж. При цьому у одного тега може бути оголошений як перший, так і другий:

Відео: Розмір шрифту в wordpress

class ="myclass" id ="myid"

Існує два способи зміни зовнішнього вигляду тексту - HTML і CSS. Якщо вам потрібно оформити один-два блоки, то використовуйте HTML. А для великої кількості абзаців з однаковим форматуванням зручнішим є CSS.

Як бачите, змінити розмір шрифту в HTML зовсім нескладно. Головне в програмуванні - це практика, тому намагайтеся більше тренуватися, і у вас все вийде!

Поділися в соц мережах:

Увага, тільки СЬОГОДНІ!

Схожі повідомлення


Увага, тільки СЬОГОДНІ!