Використання кольорів

Матеріал з ТерноВікі

Версія від 13:56, 26 квітня 2018; Мочук Оксана (обговорення | внесок)
(різн.) ← Старіша версія | Поточна версія (різн.) | Новіша версія → (різн.)
Перейти до: навігація, пошук

Зміст

Використання кольору

Нижче наведено складніші приклади, що демонструють додаткові опції доступні для опису таблиць. Ви можете поекспериментувати з цими установками та подивитись, який ефект вони матимуть. Не всі із цих опцій придатні у всіх випадках, тільки тому що Ви можете додати кольоровий фон не означає що це завжди є хорошою ідеєю. Намагайтесь робити Ваші таблиці достатньо простими — інші користувачі редагуватимуть їх також!

Кольоровий текст

Текст, що знаходиться в таблиці, можна зробити кольоровим. З цією метою застосовуються ті ж теги, що і в HTML:

  • для окремого слова — <font color="#ABCDEF">Текст</font>;
  • для довгого тексту — <div style="color:#ABCDEF">Текст, текст.</div>,

де «ABCDEF» — індекс кольору. Для "розфарбування" тексту пишуть так:

Вихідний код

{| border=1
          |Клітинка 1*1
          |Кольорове <font color="#FF00FF">одне</font> слово.
          |Клітинка 3*1
          |-
          |Клітинка 1*2
          |Клітинка 2*2
          |<div style="color:#33CC66">Кольоровий весь рядок.</div>
          |-
          |Клітинка 1*3
          |Клітинка 2*3
          |Клітинка 3*3
          |}

Як він виглядає

Клітинка 1*1 Кольорове одне слово. Клітинка 3*1
Клітинка 1*2 Клітинка 2*2
Кольоровий весь рядок.
Клітинка 1*3 Клітинка 2*3 Клітинка 3*3

Колір клітинки

Зробити кольорову клітинку можна за допомогою атрибуту «bgcolor=#ABCDEF», де «ABCDEF» — індекс кольору.

Пишеться

{| border=1
          |Клітинка 1*1
          |bgcolor=#FFCC00|Клітинка 2*1
          |Клітинка 3*1
          |-
          |Клітинка 1*2
          |Клітинка 2*2
          |Клітинка 3*2
          |-
          |bgcolor=#CCFF00|Клітинка 1*3
          |Клітинка 2*3
          |Клітинка 3*3
          |}

Як він виглядає

Клітинка 1*1 Клітинка 2*1 Клітинка 3*1
Клітинка 1*2 Клітинка 2*2 Клітинка 3*2
Клітинка 1*3 Клітинка 2*3 Клітинка 3*3

Фоновий колір таблиці

Щоб зробити кольоровим фон всієї таблиці, слід вписати атрибут «bgcolor=#ABCDEF» в перший рядок таблиці, де ставитися і атрибут рамки:

Пишеться

{| border=1 bgcolor=#66FFFF
          |Клітинка 1*1
          |Клітинка 2*1
          |Клітинка 3*1
          |-
          |Клітинка 1*2
          |Клітинка 2*2
          |Клітинка 3*2
          |-
          |Клітинка 1*3
          |Клітинка 2*3
          |Клітинка 3*3
          |}

Як він виглядає

Клітинка 1*1 Клітинка 2*1 Клітинка 3*1
Клітинка 1*2 Клітинка 2*2 Клітинка 3*2
Клітинка 1*3 Клітинка 2*3 Клітинка 3*3

Класи оформлення клітинок

заголовок звичайна клітинка
highlight
bright
shadow
dark

Також в Вікіпедії є два класи підсвічування та два типи затінення окремих клітинок, при цьому класи підсвічування надають різні кольори заголовних «!» і звичайних «|» клітинок.

Ці класи можна додавати до рядка для підсвічування відразу всіх клітинок рядка.

|- class="bright"
| ...
| ...

Або до окремо взятої клітинки; якщо потрібно просто скасувати колір, заданий в рядку, використовуйте клас transparent.

|-
|class="bright"| ...
|class="highlight"| ...

Наприклад:

         
|-class="dark"     |class="highlight"
|-class="bright"   |class="transparent"  

Для заголовків рекомендується використовувати підсвічування highlight, за необхідності виділити більш важливий заголовок — bright. Якщо є необхідність знизити важливість заголовка, можна використовувати затінення.

Для виділення груп звичайних клітинок рекомендується використовувати затінення (спочатку shadow, за необхідності — dark). Если нужно выделить одну-две ячейки, можно использовать подсветку.

Якщо в якійсь клітинці потрібно задати певний колір фону, задавайте його ось так: style="background-color: колір;" (див. таблицю кольорів). Рекомендується використовувати цю можливість тільки якщо необхідний саме конкретний колір, а не просто логічне виділення частини клітинок.

Особисті інструменти