Використання кольорів
Матеріал з ТерноВікі
Зміст |
Використання кольору
Нижче наведено складніші приклади, що демонструють додаткові опції доступні для опису таблиць. Ви можете поекспериментувати з цими установками та подивитись, який ефект вони матимуть. Не всі із цих опцій придатні у всіх випадках, тільки тому що Ви можете додати кольоровий фон не означає що це завжди є хорошою ідеєю. Намагайтесь робити Ваші таблиці достатньо простими — інші користувачі редагуватимуть їх також!
Кольоровий текст
Текст, що знаходиться в таблиці, можна зробити кольоровим. З цією метою застосовуються ті ж теги, що і в 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: колір;" (див. таблицю кольорів). Рекомендується використовувати цю можливість тільки якщо необхідний саме конкретний колір, а не просто логічне виділення частини клітинок.