Как да промените размера на шрифта в HTML

12.03.2019

Основната цел на качественото оформление на уебсайта е да направи информацията на страницата възможно най-лесна за четене и удобна за потребителя. А работата с текст чрез html е основното и основно умение, което трябва да имате, когато работите със сайтове. В тази статия се описва подробно как да преоразмерявате текст с помощта на уеб маркиращ език.

Инфографика за разработване на HTML

Форматирането на текст с HTML е лесно.

Всеки, който някога е срещал необходимостта да създава или редактира уебсайтове, първо е попитал как да форматира текста, така че да отговаря на желаните изисквания. Има много начини да се изпълни тази задача и най-лесният начин е да го направите директно в рамките на самия сайт, като използвате езика за маркиране. След като разберете как да промените размера на шрифта в html, и в бъдеще няма да има никакви трудности.

В тази статия ще опишем подробно как се извършва форматирането на шрифтове в html документи.

Пример за код

Общи принципи за редактиране на текст на уеб страници

Първо трябва да разберете какви възможности за форматирането на текст ни дава html. Има три основни характеристики на шрифта - това е шрифт (характеристика, която определя вида на буквите и знаците), цвят и размер. Четливостта на всеки документ зависи от това колко добре са комбинирани тези характеристики.

Характеристиките на текста в HTML маркировката се променят с помощта на тагове и атрибути. Етикетът е основният компонент на езика, неговата основна логическа единица и атрибутът служи за задаване на специфична стойност за всеки елемент на страницата, маркирана с етикет.

Също така е необходимо да се помни, че текстът на дисплея може да се различава при използване на различни браузъри, затова, преди да завършите работата на сайта, трябва да се уверите, че информацията се показва правилно във всички основни браузъри, използвани. Например размерът на шрифта в html, когато се използват по-стари версии на Internet Explorer, може да е различен в сравнение с новите версии.

HTML код

свободен край

Основните маркери, които се използват при форматирането на текст на уеб страница, са и .

Маркерът за двойка отговаря за всички характеристики на форматирания текст, които се задават с помощта на съответните атрибути. Този етикет е най-разбираем и лесен за използване при оформлението на страницата.

Тъй като ние се интересуваме основно от това как да променяме размера на шрифта в html, трябва да използваме атрибута size.

Изглежда така:

 Здесь располагается текст 

Стойността на размера на шрифта html се задава в числови единици от 1 (най-малката) до 7 (най-голямата). Средната стойност традиционно се приема като 3 (съответства на размера на 13,5 в слушалката Times New Roman).

Съответно, ако добавим следния код към тялото на документа, отварянето на страницата в браузъра ще покаже как размерът на текста се променя в зависимост от зададената стойност.

 Размер шрифта 1 Размер шрифта 2 Размер шрифта 3 Размер шрифта 4 Размер шрифта 5 Размер шрифта 6 Размер шрифта 7 

В допълнение към абсолютните числени стойности могат да се използват, включително и относителни. Този етикет също се използва за това. Размерът на шрифта html, както бе споменато по-горе, се приема по подразбиране от 3, следователно, започвайки от това, можете да добавяте или изваждате цели цифрови стойности, за да получите желания резултат. Ето как изглежда:

Ето текста

С посочената стойност размерът на шрифта ще съответства на стойността 6. Можете да проверите в браузъра как работи и да експериментирате с различни комбинации от числови стойности.

С помощта на маркера можете да променяте размера и цвета на шрифта в html. За да промените цвета, използвайте атрибута color и шестнадесетичния цвят.

За да направите необходимите промени, атрибутите следват една след друга в тялото на един маркер , не е необходимо да ги разделяте с никакви препинателни знаци.

свободен край

Този етикет има по-широка гама от характеристики и характеристики, отколкото . Обикновено се използва във връзка с CSS за редактиране и оформяне на определени части от документа.

За този маркер стойностите се задават чрез атрибута style. Ето как изглежда кодът:

 Здесь располагается текст 

Както можете да видите, тук се използва въвеждането на CSS-код (размер на шрифта), а размерът се задава с помощта на точки (pt, point). Стандартната стойност се приема за размер от 12 pt, който може да бъде променен чрез увеличаване или намаляване с цяло число.

Разработване на уебсайтове

Размерът на шрифта се променя при форматиране на заглавията

Често искате да намалите или увеличите размера на шрифта в html, когато редактирате заглавията. В този случай задачата е не само да променяте размера, но и логично да маркирате определена част от текста и да го обозначите като заглавие за текстовия блок.

В този случай е препоръчително да използвате тагове.

-

, свободен край

- Това е заглавието от първо ниво. В браузъра тя ще се показва като най-голямата, а маркерите от

до

използвани за маркиране на подпозициите.

Пример за код:

Заглавие от първо ниво

Препоръчително е винаги да използвате тези маркери за дизайн на заглавната част, тъй като той оптимизира кода и е по-синтактично правилен, и също така дава един стил на целия документ.

Специфичните параметри за този маркер се задават от CSS - така че можете да зададете конкретна стойност за размера на текста, неговия цвят и шрифт.

Някои последни съвети

Добавка за уеб разработчици

Затова разгледахме основните начини за промяна на размера на шрифта в html. Тази информация е достатъчна, за да се създаде чиста уеб страница с добра четливост.

За удобство обърнете внимание на следните препоръки:

  • С оформлението не трябва да се ограничава до средствата на html. След като сте усвоили основите на изграждане на сайт, можете да започнете да изучавате CSS. Това ще отвори нови хоризонти при създаването на уеб страници.
  • Не можем да пренебрегнем тестването на готовия сайт в различни браузъри и на различни платформи. Както вече бе споменато по-горе, текстовите параметри могат да се различават значително, особено когато се използват остарели версии на браузърите.
  • Винаги трябва да използвате интервали и раздели при писане на код. Това улеснява четенето и разбирането.
  • Коментарите върху кода не са само инструмент за удобно възприятие, но и знак за добър вкус сред разработчиците.