Главная   Все комиксы   Новости   Форум   Чат   Справочная
Все страницы   Недавние правки   Старые версии   Ссылки сюда

Работа с наклейками

Рекомендация для пользователей Оперы (и м.б. других браузеров с подобной функцией) - уберите приведение ширины страницы к 100% ширины экрана, это влияет на реальное положение наклеек.

Координаты наклеек

Наклейки указываются по такой схеме:
@вниз от верхнего края,вправо от левого края,ширина наклейки,высота наклейки
Полезно, если вручную исправляем неточно поставленную наклейку

Примеры:
меняем @37,25,419,112 на @37,25,419,122 - наклейка увеличивается вниз на 10 пикселей
меняем @37,25,419,112 на @27,25,419,122 - наклейка увеличивается вверх на 10 пикселей (сдвиг выше + увеличение вниз)
меняем @37,25,419,112 на @27,25,419,132 - наклейка расширяется вверх-вниз на 20 пикселей (сдвиг выше + двойное увеличение вниз) - её центр остаётся на месте

меняем @37,25,419,112 на @37,25,429,112 - наклейка увеличивается вправо на 10 пикселей
меняем @37,25,419,112 на @37,15,429,112 - наклейка увеличивается влево на 10 пикселей (сдвиг левее + увеличение вправо)
меняем @37,25,419,112 на @37,15,439,112 - наклейка расширяется влево-вправо на 20 пикселей (сдвиг левее + двойное увеличение вправо) - её центр остаётся на месте

Поворачивание наклейки

В случае наклонённого текста можно добавлять через запятую пятый параметр - угол наклона в градусах, причём -90 = 270

Скругления

Также можно указать скругления, которые будут применены вместо стандартных 10px. Стандарты border-radius-{top|bottom}-{left|right}1) указывают, что можно задать значение для конкретного угла, а через пробел - также и второе значение для эллиптического угла

Поддерживаются все единицы CSS (1in = 6pc = 72pt = 2.54cm = 25.4mm, px, em, ex, %), кроме ключевых слов, конечно (small, large и т.п). Рекомендуются em и % - они нормально масштабируются. Просто число приравнивается к числу пикселей (20 = 20px). То есть для твёрдых углов ставим 0

Формат: обычные координаты;левый верхний угол,правый верхний угол,правый нижний угол,левый нижний угол

Примеры: @37,25,419,112;4em,3em,2em,1em - наклейка с уменьшающимися по часовой стрелке скруглениями
@37,25,419,112;3em,4em,1em,2em - наклейка с уменьшающимися против часовой стрелки скруглениями

Для пустых значений действует приравнивание пустого значения к левому от него, если оно непустое
@37,25,419,112;4em,,, - равнозначна @37,25,419,112;4em,4em,4em,4em
@37,25,419,112;4em,,2em, - равнозначна @37,25,419,112;4em,4em,2em,2em, то есть верхние углы симметричны друг другу, и нижние тоже, попарно, как чаще всего случается в комиксах

В случае пустого первого значения оно приравнивается к 10%
@37,25,419,112;,,, - равнозначна @37,25,419,112;10%,10%,10%,10% и равнозначна @37,25,419,112
@37,25,419,112;,,2em, - равнозначна @37,25,419,112;10%,10%,2em,2em

И наконец эллиптические углы форматируются так:
@37,25,419,112;2em 4em,1em 3em,2em 5em,1em 4em - 4 разных эллиптических угла
Передача значений также касается и их:
@37,25,419,112;2em 4em,,, - равнозначна @37,25,419,112;2em 4em,2em 4em,2em 4em,2em 4em
и т.п.

Дополнение. Конечные запятые не обязательны - «;4em» работает ровно так же, как «;4em,,,»

Собственно, всё это улучшение и придумано из-за того, что просто border-radius не поддерживал более 1 указателя эллиптических углов, а выглядит оно часто очень уродливо. Эта возможность совместима с поворачиванием наклеек

Расширение функционала

Добавлена поддержка разностей и сумм в качестве координат. Это позволяет, грубо настроив наклейки (например, высоту 102), скруглить им края, а затем точно подводить их, не пересчитывая в уме (обычно) трёхзначные числа (например, отнять 4) и не путаясь, что в какую сторону отнимать (вместо 98 можно писать 102-4).

Расширение функционала-2

Знак # обозначает белый фон, то же, что #fff или #ffffff. Если требуется небелый цвет фона, можно после # указать трёх- либо шестисимвольный RGB-код цвета. Например, теперь можно задавать белый текст на чёрном фоне, для чего нужна «фоновая» наклейка с текстом #000 (код чёрного цвета) и наклейка с текстом перевода, обработанным последней пиктограммой из группы (белый цвет)

Планы

В планах разве что добавление эффектов вроде «рыбьего глаза» и «конусов», которые часто встречаются в комиксах

Версии наклеек

Ctrl+←11stylesCtrl+↑Ctrl+→index

Яндекс.Метрика