Як змінити колір шрифту html

Як змінити колір шрифту html

Для вказівки кольору шрифту в сторінках веб-сайтів можна використовувати як кошти, передбачені в мові HTML, так і засоби мови CSS (Cascading Style Sheets — «Каскадні таблиці стилів»). Залежно від особливостей верстки конкретної сторінки може бути доцільним використання одного чи іншого методу, а іноді і їх комбінування.

Інструкція

  1. Використовуйте атрибут color, щоб задати колір виведеного на сторінку тексту, вміщеного між відкриває (<font>) і закриває (</ font>) тегами, які задають параметри шрифту. Наприклад:

    <font color=»#ff0000″> Червоний шрифт </ font>

    Тут колір шрифту вказано його шістнадцятковим кодом # ff0000, але для основних кольорів і деяких іменованих відтінків можна використовувати і текстове («мнемонічне») англомовне значення. Наприклад, # ff0000 можна замінити на Red.
  2. Вказуйте потрібний відтінок кольору в атрибуті style, якщо треба змінити колір фрагмента тексту, вміщеного всередину якогось блочного або рядкового елемента сторінки. Наприклад, якщо фрагмент тексту поміщений всередину блокового елемента, утвореного тегом div, то задати колір шрифту можна так:

    <div style=»color: #7fffd4;»> Текст аквамаринового кольору </ div>

    У разі використання рядкового елемента span застосовувати атрибут style треба точно таким же способом:

    Текст <span style=»color: #7fffd4;»> аквамаринового </ span> кольору.

    Тут колір теж можна задавати як шістнадцятковим кодами, так і текстовими позначеннями, наприклад, # 7fffd4 можна поміняти на aquamarine.
  3. Поміщайте в заголовну частину документа або в окремий css-файл опис стилів, що містить вказівку кольору шрифту потрібних блоків тексту — це універсальний і частіше застосовується у верстці веб-сторінок метод. Наприклад, щоб задати синій колір шрифту для всієї сторінки, у її заголовну частину (між тегами <head> і </ head>) можна помістити такий код:

    <style type=»text/css»>

     body {color: blue}

    </ Style>
  4. Використовуйте атрибути class, якщо в описі стилів треба задати різний колір різним фрагментам тексту. Наприклад, якщо треба мати на можливість вставляти при створенні документа і, надалі, при його зміні, текстові блоки червоного і синього кольорів, то можна помістити в заголовну частину такий код:

    <style type=»text/css»>

     . BlueText {color: Blue}

     . RedText {color: Red}

    </ Style>

    Тут blueText і redText — це імена, а точка перед ними означає, що імена відносяться до атрибутів class. Щоб забарвити будь-яку частину тексту, наприклад, в червоний колір, треба додати до відповідного тегу атрибут class зі значенням redText:

    <p class=»redText»> Червоний текст </ p>