Добавил:
Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Скачиваний:
20
Добавлен:
15.01.2021
Размер:
111.1 Кб
Скачать

Лабораторна робота № 5

Тема:Каскадні таблиці стилів

Мета:

навчитися форматувати текст засобами каскадних таблиць

Теоретичні відомості

Каскадні таблиці стилів або CSS (Cascading Style Sheets) були революцією, WWW, що потрясла. Якщо до цього Web-дизайнер не знав, як виглядатиме його творіння в різних програмах Web-оглядачів, то тепер він може контролювати все: від зображення шрифту до положення картинки на сторінці.

Припустимо, вам потрібно змінити колір тексту в HTML-документі з чорного на синій. Ви поміщаєте його в пару тегів <FONT> і </FONT> наступного вигляду:

<P><FONT color="blue">Це текст синього кольру</FONT></P>

А зараз уявимо, що ви внесли визначення зовнішнього вигляду тексту в інше місце документа:

P.bluetext { color: blue }

Цей рядок означає, що ми визначили для тексту, що знаходиться усередині тега <P> і поміченого стильовим класом bluetext, синій колір шрифту. Така конструкція HTML називається визначенням стилю або просто стилем.

В результаті в HTML-тексті у нас залишаться тільки теги логічного форматування тексту:

<P class="bluetext">Це синій текст</P>

Тут ми помітили потрібний текст за допомогою атрибуту class, привласнивши йому значення bluetext. Атрибут class задає ім'я стильового класу для тега, і його підтримують всі теги.

Ви можете перепризначувати кольори тексту для всіх тегов <P>. В цьому випадку ми не задаємо ім'я стильового класу:

P { color: blue }

Або ви можете задати форматування для стильового класу, не прив'язаного ні до якого тегу:

bluetext{ color: blue }

І тепер ви можете привласнювати стильовий клас тексту, ув'язненому в будь-які теги:

<H1 class="bluetext">Це синій колір</H1>

<CENTER class="bluetext">Це синій колір</CENTER>

Це

<B class="bluetext">жирний синій</B> текст

Ви можете дати спеціальне форматування тегу тільки в тому випадку, якщо він поміщений всередину іншого тега:

H7 B { color: blue }

І тепер:

<H7><B>Этот</B> текст буде синім</H7>

<P>А <B>этот</B> - не буде!</P>

Більш того, ви можете вбудувати визначення стилю прямо в тег:

<P style="color: blue">Це синій текст</P>

Це досягається за допомогою атрибуту style, який також підтримують всі теги HTML.

І ще один спосіб прив'язати стиль до якого-небудь тегу - використовувати атрибут id, задаючий унікальне ім'я елементу HTML.

#headerofdocument { font-size: 20pt }

Тут ми задали розмір шрифту 20 пунктів.

<H1 id="headerofdocument">Це заголовок документа</H1>

Ви можете задавати декілька атрибутів у визначенні стилю. В цьому випадку вони розділяються крапкою з комою:

P { color: blue; fotn-size: 9ptl; text-align: center }

Визначення стилів, винесені в заголовок HTML-документа, складають таблицю стилів. Таблиця стилів полягає в теги <STYLE> і </STYLE>:

<Style [type="text/css"]>

. . .

</STYLE>

Тег <STYLE> може містити необов'язковий атрибут type, що містить обов'язкове значення text/css.

Таблицю стилів можна винести в окремий файл і використовувати відразу в декількох документах. В цьому випадку в заголовку HTML-документа необхідно розмістити тег <LINK>, вказуючий на цю таблицю стилів:

<LINK rel="stylesheet" href="{ Адреса файлу таблиці стилів}">

Властивості шрифту

font - задає параметри шрифту елементу сторінки.

Замінює атрибути font-family, font-height, font-size, font-style, font-variant і font-weight. Значення цих атрибутів можуть розташовуватися у будь-якому порядку.

font: {font-family} [{font-height}] [{font-size}] [{font-style}] [{font-variant}] [{font-weight}];

Значення за умовчанням - normal normal normal medium normal "Times New Roman".

Альтернативний формат:

font: caption|icon|menu|message-box|small-caption|status-bar;

В цьому випадку доступні шість зумовлених значень, задаючі один із стандартних шрифтів, використовуваних в елементах інтерфейсу Windows:

font: caption; - шрифт заголовка кнопок, текстових міток і т.п.;

font: icon; - шрифт підписів під піктограмами;

font: menu; - шрифт пунктів меню;

font: message-box; - шрифт вмісту стандартних вікон-попереджень;

font: small-caption; - дрібний шрифт заголовків;

font: status-bar; - шрифт вмісту рядка стану.

Підтримується IE починаючи з 4.0

font-family - вказує ім'я шрифту або шрифтового сімейства, використовуваного в елементі сторінки.

font-family: { Ім'я шрифту}|serif|san-serif|cursive|fantasy|monospace;

Як значення цього атрибуту задається або безпосередньо ім'я потрібного шрифту, або одне з п'яти зумовлених значень, задаючих ім'я шрифтового сімейства. Можна задавати одночасно декілька шрифтів, розділивши їх імена комами; в цьому випадку Web-оглядач зможе вибрати з них той, який встановлений на комп'ютері клієнта. Якщо ім'я шрифту містить пропуски, його слід узяти в лапки.

font-family: "Times New Roman",sans-serif;

Підтримується IE починаючи з 3.02 для текстових елементів і починаючи з 4.0 для нетекстових.

Підтримується NN починаючи з 4.0

font-weight - задає "жирність" шрифту, використовуваного в елементі сторінки.

font-weight: normal|bold|bolder|lighter|100..900;

"Жирність" може бути задана трьома способами. По-перше, зумовленими значеннями normal і bold, задаючими звичайне і жирне зображення відповідно. По-друге, відносними значеннями bolder і lighter, що роблять шрифт елементу сторінки жирніше і світліше. І, по-третє, одним з дев'яти значень від 100 до 900; тут нормальному зображенню відповідає значення 400, а жирному - 700.

font-weight: normal; - звичайний;

font-weight: lighter; - світліше;

font-weight: bold; - жирний;

font-weight: bolder; - жирніше;

font-weight: від 100 до 900 - будь-яке значення, кратне 100 (200,700).

Значення за умовчанням normal.

Підтримується IE починаючи з 3.02 для текстових елементів і починаючи з 4.0 для нетекстових. При цьому IE 4.0 і старіші версії розпізнавали тільки значення normal і bold цього атрибуту.

Підтримується NN починаючи з 4.0

font-size - задає розмір шрифту, використовуваного в елементі сторінки.

font-size: xx-small|x-small|small|medium|large|x-large|xx-large|larger|smaller|{ Абсолютний розмір}|{ Відносний розмір}%;

Можливе завдання або абсолютного розміру шрифту в одній з підтримуваних CSS одиниць вимірювання, або як відсоток від розміру шрифту батька. Також доступні дев'ять певних значень.

font-size: 200% - відносна величина (відсотки)

font-size: 150px - розмір в пікселях

font-size: 300pt - розмір в пунктах

font-size: {xx-small,small,medium,large,x-large,xx-large} - задають один з семи розмірів шрифтів, підтримуваних HTML

font-size: {smaller,larger} - задають розмір шрифту, який на розмір або більше, або менше батьківського шрифту відповідно

Підтримується IE починаючи з 3.02 для текстових елементів і починаючи з 4.0 для нетекстових.

Підтримується NN починаючи з 4.0

font-style - задає зображення шрифту.

font-style: normal|italic|oblique;

font-style: normal; - задає звичайний вид шрифту (використовується за умовчанням);

font-style: italic - курсивне зображення;

font-style: obligue - похиле зображення (легкий нахил нормального шрифту) (IE відображає як курсив, а NN не підтримує).

Підтримується IE починаючи з 3.02 для текстових елементів і починаючи з 4.0 для нетекстових.

Підтримується NN починаючи з 4.0

font-variant - задає вид малих букв шрифту, використовуваного в елементі сторінки.

font-variant: normal|small-caps;

font-variant: normal; - задає звичайний вид малих букв шрифту (використовується за умовчанням);

font-variant: small-caps; - робить їх такими, як великі букви, тільки меншого розміру (капітель).

Підтримується IE починаючи з 4.0

Колірна гамма

color - Визначає колір елементу.

color: { Колір};

Підтримується IE починаючи з 3.02 для текстових елементів сторінки і починаючи з 4.0 для нетекстових. Підтримується NN починаючи з 4.0

background - задає всі властивості фону елементу сторінки в один прийом. Замінює собою атрибути background-attachment, background-color, background-image, background-position і background-repeat.

background: [{background-color}] [{background-image}] [{background-repeat}] [{background-attachment}] [{background-position}];

Значення цих властивостей можуть розташовуватися у будь-якому порядку.

Значення за умовчанням transparent none repeat scroll 0% 0%.

Підтримується IE починаючи з 3.02; завдання значень background-position і background-repeat підтримується починаючи з 4.0

background-color - задає фоновий колір Web-сторінки або її елементу.

background-color: { Колір}|transparent;

Зумовлене значення transparent задає "прозорий" фон. Воно ж є значенням за умовчанням.

Підтримується IE починаючи з 4.0, у складі атрибуту background - з 3.02

Підтримується NN починаючи з 4.0

background-image - задає фоновий малюнок Web-сторінки або її елементу.

background-image: url({ Інтернет-адреса файлу малюнка})|none;

Зумовлене значення none відключає фоновий малюнок. Воно ж є значенням за умовчанням.

Підтримується IE починаючи з 4.0, у складі атрибуту background - з 3.02

Підтримується NN починаючи з 4.0

background-attachment - даний атрибут дозволяє "зафіксувати" фоновий малюнок, щоб він не прокручувався разом з вмістом Web-сторінки.

background-attachment: scroll|fixed;

background-attachment: scroll; - фонове зображення прокручується разом з вмістом сторінки (значення за умовчанням);

background-attachment: fixed; - фонове зображення фіксується на одному місці і не прокручується з вмістом сторінки.

Застосовується тільки для тега <BODY>.

Підтримується IE починаючи з 4.0, у складі атрибуту background - з 3.02

background-repeat - встановлює порядок повторення малюнка фону на Web-сторінці або її елементі.

Іноді цей атрибут необхідний, щоб зайняти весь вільний простір, якщо фоновий малюнок дуже малий, щоб покрити простір без повторення.

background-repeat: repeat|no-repeat|repeat-x|repeat-y;

background-repeat: repeat; - розмножує фонове зображення на всіх напрямках (значення за умовчанням);

background-repeat: no-repeat; - забороняє фоновому зображенню повторюватися;

background-repeat: repeat-x; - розмножує фонове зображення тільки по горизонталі;

background-repeat: repeat-y; - розмножує фонове зображення тільки по вертикалі.

Підтримується IE починаючи з 4.0

background-position - задає місцезнаходження фонового малюнка. Це комбінований атрибут, замінюючий атрибути background-position-x і background-position-y.

background-position: [{background-position-x}] [{background-position-y}];

Якщо задана тільки одна координата, то вона вважається горизонтальною, а для вертикальної приймається значення 50%.

Значення за умовчанням 0% 0%.

Підтримується IE починаючи з 4.0

background-position-x - задає горизонтальну координату фонового малюнка.

background-position-x: {X}|{X}%|left|center|right;

Координата може бути задана цілим числом (абсолютна координата), відсотком від відповідного розміру фонового малюнка (відносна координата) або зумовленим значенням. Доступні три зумовлені значення: left, center, right, які задають вирівнювання фонового малюнка на сторінці по лівому краю, по центру і по правому краю відповідно.

Значення за умовчанням 0%.

Підтримується IE починаючи з 4.0

background-position-y - задає вертикальну координату фонового малюнка.

background-position-y: {Y}|{Y}%|top|center|bottom;

Координата може бути задана цілим числом (абсолютна координата), відсотком від відповідного розміру фонового малюнка (відносна координата) або зумовленим значенням. Доступні три зумовлені значення: top, center, bottom, які задають вирівнювання фонового малюнка на сторінці по верху, по центру і по низу сторінки відповідно.

Значення за умовчанням 0%.

Підтримується IE починаючи з 4.0

scrollbar-3dlight-color - задає колір верхньої і лівої меж смуги прокрутки, її бігунка і стрілок.

scrollbar-3dlight-color: { Колір};

Підтримується IE починаючи з 5.5

scrollbar-arrow-color - задає колір стрілок на кнопках смуги прокрутки.

scrollbar-arrow-color: { Колір};

Підтримується IE починаючи з 5.5

scrollbar-base-color - задає колір бігунка і кнопок-стрілок смуги прокрутки.

scrollbar-base-color: { Колір};

Підтримується IE починаючи з 5.5

scrollbar-darkshadow-color - задає колір "тіні", що відкидається бігунком і кнопками прокрутки смуги прокрутки (колір правих і нижніх гранієй).

scrollbar-darkshadow-color: { Колір};

Підтримується IE починаючи з 5.5

scrollbar-face-color - задає колір бігунка і кнопок прокрутки смуги прокрутки.

scrollbar-face-color: { Колір};

Підтримується IE починаючи з 5.5

scrollbar-highlight-color - задає колір "освітленої" частини бігунка і кнопок прокрутки смуги прокрутки (колір лівих і верхніх їх граней).

scrollbar-highlight-color: { Колір};

Підтримується IE починаючи з 5.5

scrollbar-shadow-color - задає колір "неосвітленої" частини бігунка і кнопок прокрутки смуги прокрутки (колір правих і нижніх їх граней). Не плутати з кольором "тіні", атрибутом scroll-darkshadow-color, що задається.

scrollbar-shadow-color: { Колір};

Підтримується IE починаючи з 5.5

scrollbar-track-color - задає колір робочої частини смуги прокрутки, тобто тій її частині, по якій переміщається бігунок.

scrollbar-track-color: { Колір};

Підтримується IE починаючи з 5.5

Властивості тексту

text-decoration - задає спеціальне оформлення тексту: підкреслений, закреслений і т.п.

text-decoration: none|underline|overline|line-through|blink;

text-decoration: none; - відміняє спеціальне оформлення (значення за умовчанням для більшості тегов);

text-decoration: underline; - підкреслює текст (значення за умовчанням для тегов <A>, <INS> і <U>);

text-decoration: overline; - межа зверху тексту;

text-decoration: line-through; - закреслює текст (значення за умовчанням для тегов <DEL>, <S> і <STRIKE>);

text-decoration: blink; - мигання тексту (відсутній в IE)

text-decoration: uppercase - всі букви стають заголовними;

text-decoration: lowercase - всі букви стають маленькими (прописними);

text-decoration: capitalize - кожне слово в рядку починається з великої букви.

Підтримується IE починаючи з 3.02 для текстових елементів сторінки і починаючи з 4.0 для нетекстових.

Підтримується NN починаючи з 4.0

text-underline-position - задає місцезнаходження лінії підкреслення: вище або нижче за текст. Має сенс, якщо атрибут text-decoration рівний underline або overline.

text-underline-position: below|above;

text-underline-position: below; - розміщує лінію підкреслення під текстом (значення за умовчанням);

text-underline-position: above; - над текстом ("надчеркиваніє").

Підтримується IE починаючи з 5.5

text-align - визначає горизонтальне вирівнювання тексту.

text-align: left|right|center|justify;

text-align: left; - вирівнювання тексту по лівому краю (значення за умовчанням);

text-align: right; - вирівнювання по правому краю;

text-align: center; - вирівнювання по центру;

text-align: justify; - вирівнювання по обох краях (по ширині).

Підтримується IE починаючи з 3.02; значення justify підтримується починаючи з 4.0

Підтримується NN починаючи з 4.0

text-align-last - задає горизонтальне вирівнювання останнього рядка абзацу.

text-align-last: auto|inherit|left|right|center|justify;

text-align: auto; - вирівнює останній рядок абзацу так само, як і решту рядків (грунтуючись на значенні атрибуту text-align) (значення за умовчанням);

text-align: inherit; - так само, як вирівняний текст ;

text-align: left; - вирівнювання тексту по лівому краю;

text-align: right; - вирівнювання по правому краю;

text-align: center; - вирівнювання по центру;

text-align: justify; - вирівнювання по обох краях (по ширині).

Підтримується IE починаючи з 5.5

text-indent - встановлює відступ червоного рядка.

text-ident: { Відступ}|{ Відступ}%;

Відступ може бути заданий як абсолютною величиною, так і відсотком від ширини.

Значення за умовчанням 0.

Підтримується IE і NN починаючи з 4.0

text-height - інтервал між рядками тексту.

text-height: { Інтервал}|{ Інтервал}%;

Інтервал може бути заданий як абсолютною величиною, так і відсотком від ширини.

Підтримується IE і NN починаючи з 4.0

text-transform - Задає перетворення регістра символів тексту.

text-transform: none|capitalize|uppercase|lowercase;

text-transform: none; - відключає будь-які перетворення регістра символів (значення за умовчанням);

text-transform: capitalize; - перетворить першу букву кожного слова тексту у верхній регістр;

text-transform: uppercase; - перетворить всі символи тексту у верхній регістр;

text-transform: lowercase; - в нижній регістр.

Підтримується IE і NN починаючи з 4.0

clear - задає поведінку тексту при "обтіканні" ним деяких елементів сторінки, таких як зображення.

clear: none|left|right|all;

Атрибут задається для тексту, а не для елементу сторінки, який він "обтікатиме".

clear: none; - дозволяє тексту "обтікати" елемент сторінки (значення за умовчанням);

clear: left; - забороняє тексту "обтікати" елемент сторінки з лівого боку;

clear: right; - з правого боку;

clear: all; - з обох боків.

Підтримується IE і NN починаючи з 4.0

word-spacing - визначає додаткова відстань між словами в тексті.

word-spacing: normal|{ Величина};

Значення цього атрибуту може бути задане або абсолютною величиною в одній з підтримуваних CSS одиниць вимірювання, або зумовленим значенням normal, задаючим стандартну величину відстані між символами.

Значення за умовчанням normal.

Підтримується IE починаючи з 4.0

word-wrap - встановлює, чи буде рядок, що виходить за межі елементу сторінки і не містить пропусків, переноситися по словах.

word-wrap: normal|break-word;

word-wrap: normal; - забороняє переносити рядки по словах (значення за умовчанням);

word-wrap: break-word; - вирішує.

Підтримується IE починаючи з 5.5

word-mode - задає напрям рядків тексту: горизонтальне або вертикальне.

word-mode: lr-tb|tb-rl;

word-mode: lr-tb; - задає звичайне горизонтальне розташування рядків тексту; текст пишеться зліва направо і зверху вниз (значення за умовчанням);

word-mode: tb-rl; - повертає текст на 90° за годинниковою стрілкою; при цьому він писатиметься зверху вниз і справа наліво.

Підтримується IE починаючи з 5.5

leter-spacing - визначає відстань між символами в тексті.

letter-spacing: normal|{ Величина};

Значення цього атрибуту може бути задане або абсолютною величиною в одній з підтримуваних CSS одиниць вимірювання, або зумовленим значенням normal, задаючим стандартну величину відстані між символами.

Значення за умовчанням normal.

Підтримується IE починаючи з 4.0

line-height - задає вертикальну відстань між рядками тексту.

line-height: normal|{Y}|{Y}%;

Висота може бути задана як абсолютною величиною, так і відсотком від висоти.

Зумовлене значення normal задає стандартна відстань.

Значення за умовчанням normal.

Підтримується IE і NN починаючи з 4.0

direction - задає порядок читання тексту: зліва направо або справа наліво.

direction: ltr|rtl|inherit;

direction: ltr; - задає порядок читання зліва направо (значення за умовчанням);

direction: rtl; - справа наліво;

direction: inherit; - примушує успадковувати порядок читання.

Для документів, складених на європейських мовах, порядок читання завжди зліва направо (ltr).

Підтримується IE починаючи з 5.0

unicode-bidi - задає поведінку вбудованих елементів при зміні надсилання листа за допомогою атрибуту direction.

unicode-bidi: normal|embed|bidi-override;

unicode-bidi: normal; - змінює надсилання листа (використовується за умовчанням);

unicode-bidi: embed; - змінює надсилання листа тільки у вбудованого елементу;

unicode-bidi: bidi-override; - аналогічно embed за тим виключенням, що надсилання листа змінюється згідно значенню атрибуту direction, незалежно від локальних установок Web-оглядача.

Підтримується IE починаючи з 5.0

accelerator - дозволяє вказати, чи містить текст елементу сторінки клавішу-прискорювач.

accelerator: true|false;

Клавіша-прискорювач - це особлива клавіша на клавіатурі, при натисненні якої разом з клавішею <Alt> відбувається перехід до даного елементу сторінки.

accelerator: true; - вказує, що текст містить клавішу-прискорювач;

accelerator: false; - не містить.

Значення за умовчанням не має.

Приклад використання:

<LABEL for="txtName"><U style="accelerator: true">И</U>мя</LABEL>

<INPUT type="text" id="txtName" accesskey="B" value="Имя користувача">

В цьому випадку символ "И" в слові "Ім'я" буде підкреслений. Якщо в регіональних налагодженнях операційної системи Windows 2000 була вибрана опція Приховати індикатори клавіш-прискорювачів до натиснення Alt, цей символ не буде підкреслений, поки користувач не натисне клавішу <Alt> на клавіатурі.

Підтримується IE починаючи з 5.0

Властивості тексту, що містить ієрогліфи

text-justify - задає тип тексту по ширині. Значення атрибуту text-align при цьому повинне бути рівне justify.

text-justify: auto|newspaper|distribute|distribute-all-lines|distribute-center-last|inter-word|inter-ideograph|inter-cluster|kashida;

text-justify: auto; - віддає управління вирівнюванням по ширині на розсуд Web-оглядача (використовується за умовчанням);

text-justify: newspaper; - вирівнює рядки, змінюючи відстань між словами і між символами;

text-justify: distribute; - аналогічно newspaper і призначено для азіатських мов (тайський і ін.);

text-justify: distribute-all-lines; - аналогічно distribute за тим виключенням, що останній рядок абзацу піддається повному вирівнюванню. Призначено для ієрогліфічних мов;

text-justify: distribute-center-last; - не реалізовано;

text-justify: inter-word; - вирівнює рядки, змінюючи тільки відстань між словами;

text-justify: inter-ideograph; - вирівнює рядки ієрогліфічного тексту, змінюючи відстані між словами і між ієрогліфами;

text-justify: inter-cluster; - вирівнює рядки тексту на азіатських мовах, що не містять пропусків між словами;

text-justify: kashida; - вирівнює рядки тексту на арабській мові, змінюючи ширину самих символів.

Підтримується IE починаючи з 5.0

text-autospace - дозволяє встановити, чи додаватиме додатковий простір між фрагментами тексту, написаними на різних мовах.

text-autospace: none|ideograph-alpha|ideograph-numeric|ideograph-parenthesis|ideograph-space;

text-autospace: none; - забороняє додавати додатковий простір між фрагментами тексту (використовується по умочанію);

text-autospace: ideograph-alpha; - додає додатковий простір між ієрогліфічними і неієрогліфічними (літінськимі, киріллістічеськимі, грецькими і т.д.) фрагментами тексту;

text-autospace: ideograph-numeric; - додає додатковий простір між ієрогліфічним текстом і цифрами;

text-autospace: ideograph-parenthesis; - додає додатковий простір між ієрогліфічним текстом і круглими дужками;

text-autospace: ideograph-space; - збільшує ширину пропусків, що граничать з ієрогліфічним текстом.

Підтримується IE починаючи з 5.0

text-kashida-space - задає відсоток, на який розширюватимуться символи арабської мови при вирівнюванні тексту по ширині. Можна використовувати тільки, якщо атрибут text-justify рівний auto, distribute, kashida або newspaper.

text-kashida-space: { Розширення}%|inherit;

Величина відступу може бути задана як відсоток вільного простору між символами, на який вони можуть розширюватися. Значення 0% (використовується за умовчанням) означає, що розширення символів неприпустимо, а замість них розширюватиметься вільний простір; значення 100% - що допустиме розширення тільки символів, але не вільного простору.

Підтримується IE починаючи з 5.5

line-break - задає правила розриву рядків для тексту на японській мові.

line-break: normal|strict;

line-break: normal; - задає звичайні правила розриву японського тексту (значення за умовчанням);

line-break: strict; - задає строгі правила.

Підтримується IE починаючи з 5.0

word-break - включає або відключає підтримку перенесення рядків по словах (а не тільки по пропусках) для текстів, що містять фрагменти на різних мовах.

word-break: normal|break-all|keep-all;

word-break: normal; - дозволяє рядкам "розриватися" по слову (використовується за умовчанням);

word-break: break-all; - призначено для текстів на азіатських мовах з невеликими іншомовними фрагментами;

word-break: keep-all; - призначено для текстів, що включають фрагменти на ієрогліфічних мовах.

Підтримується IE починаючи з 5.0

ime-mode - задає стан IME (Input Method Editor - редактор способу введення), за допомогою якого вводяться ієрогліфічні тексти на китайській, корейській і японській мовах. Цей атрибут застосовується тільки для полів введення.

ime-mode: auto|active|inactive|disabled;

ime-mode: auto; - передає управління IME Web-оглядачеві (значення за умовчанням);

ime-mode: active; - активізує IME. Користувач може його деактівізіровать;

ime-mode: inactive; - деактівізіруєт IME. Користувач може його активізувати;

ime-mode: disabled; - відключає IME.

Підтримується IE починаючи з 5.0

layout-flow - задає напрям написання тексту: по горизонталі або по вертикалі.

layout-flow: horizontal|vertical-ideographic;

layout-flow: horozontal; - задає горизонтальний напрям написання тексту (значення за умовчанням);

layout-flow: vertical-ideographic; - вертикальний напрям написання тексту.

Підтримується IE починаючи з 5.5. В даний час визнаний застарілим; замість нього рекомендується використовувати атрибут writing-mode.

layout-grid - задає параметри розмітки елементу сторінки, використовуваної для виведення ієрогліфічних текстів на китайській, корейській і японській мовах. Замінює атрибути layout-grid-char, layout-grid-line, layout-grid-mode і layout-grid-type.

layout-grid: [{layout-grid-char}] [{layout-grid-line}] [{layout-grid-mode}] [{layout-grid-type}]

Значення цих атрибутів можуть розміщуватись у будь-якому порядку.

Значення за умовчанням - both loose none none.

Підтримується IE починаючи з 5.0

layout-grid-char - задає крок горизонтальної розмітки елементу сторінки, використовуваної для виведення ієрогліфічних текстів на китайській, корейській і японській мовах.

layout-grid-char: none|auto|{Y}Y}%;

Крок розмітки може бути заданий як абсолютною величиною, так і відсотком від кроку розмітки. Зумовлене значення auto примушує Web-оглядач встановлювати крок розмітки по максимальному символу тексту. Інше зумовлене значення none взагалі відключає розмітку.

Значення за умовчанням - none.