CSS-константы: первые тесты уже на ваших экранах

[XaocCPS]

Чем-то настораживают меня эти глобальные константы :(, не получилось бы так, что спустя какое-то время их использование станет плохим тоном...
В любом случае спасибо за статью, буду с интересом ждать продолжения.

[GRINDER33]

При том, что на одной странице могут подгружаться несколько css-файлов, действительно могут быть определённые неприянтности с использованием глобальных переменных.
И пока использование глобальных переменных в css не кажется удобноиспользуемым.

[mnemonic]

Придумают namespace'ы :)

[Axelerator]

Согласен, блин. В CSS И так бордачить можно нехило. А так вообще чёрт ногу сломит.

[catsmeetman]

Объясните в чем выхода. В том, что я в одном месте указываю свойство константе, а потом его вызываю много-много раз?

[spelesto]

Позволит менять несколько параметров, и они изменятся во всей реализации.

[catsmeetman]

Ну дык, а кто мещает присвоить элементам один и тот же класс и менять его параметры?

[Alert]

Ну ты забыл что с появлением компьютеров люди начали ломать голову над решением проблем которых раньше и не было?
Здесь похоже такая же ситуация.

[marapper]

на мой взгляд статическое изменение (то о чем было сказано выше) и динамическое изменение (в каждом классе небольшие изменения) спокойно решаются и с помощью наследования - не зря таблица стилей каскадной называется. пока весьма спорны применение этих переменных...

[aps]

неумеренное применение нескольких классов к одному элементу иногда приводит к ухудшению читабельности кода. Имхо.

[catsmeetman]

Ой спасибо, и ктож это мне карму в минус загнул?? Спасибо большое

[habratchanka]

Об этом спорили тут:
http://habrahabr.ru/blog/css/39699.html

[habratchanka]

скушал парсер :(

[Butylski]

константы - это хорошо :)

PS: у вас ошибка в коде (fontcolor: red).. двоеточие пропустили. или без него прожевывается нормально?

[habratchanka]

нет, без двоеточия не работает :) Просто правила название и пропустила. Спасибо

[Butylski]

года через 2-3 только появится не только в WebKit, к сожалению.
долго ждать.. индусы они же не быстрые

[aps]

Приплюсуйте к этому сроку еще 2-3 года на поддержку старых броузеров.

[maxic]

CSS константы это то чего не хватало. Представьте большой файл темы в котором вы хотите сменить цветовую гамму?
Да ручками в конце концов можно это сделать... но сколько времени и нервов уйдет.
Да и вообще честно говоря не понятно, почему в css не реализованы константы

[Kaaboeld]

а так:
общий элемента{параметры}
style1,style2...{параметр бг}
style1,style2...{параметр колор}
?
Я при верстке в первую очередь (как я думаю и многие) объявляю "константы" (ммм, так их называю)...

[maxic]

Скажем так, это не совсем константы.... даже скорее совсем не константы. :)

[Kaaboeld]

извините но чем же так радикально они отличаются от "констант" приведенных выше?
грубо говоря это подход для "сегодняшнего дня" когда вместо class="класс1 класс2_подстройка..." мы опираемся на имя_тэга.

Счас еще пишу на js для данных нужд доп модуль как раз под данные нужды но это надстройка не нативная и по этому ведет за собой вполне понятные трудности.

[f0g]

так можно конечно, но лучше не нужно
объявление одного селектора размазывается по всему файлу (если в нём используется несколько констант и что-то своё, уникальное). я бы не хотел потом такой css редактировать ...
константы как раз нужны для того что бы избежать таких решений ...

[Kaaboeld]

Любой метод можно извратить как угодно в процессе не правильного (не обдуманного) применения...

[f0g]

где тут извращение?

вы же сами написали:
style1,style2...{параметр бг}
style1,style2...{параметр колор}
очевидно, что это не все свойства селкторов style1 и style2, то есть они ещё дальше будут описаны. вот и получаем каждый селектор уже в 3х разных местах. это удобно?

просто я тоже долго думал как обойти отсутствующие константы в css. ваш метод конечно пробовал. для меня "размазаность" селекторов перебивает все плюсы констант.
вам это не мешает?

[Whirlwind]

div1_height - div2_height это calc()

[habratchanka]

calc() будет только в FF 3.1

[Whirlwind]

и?

[habratchanka]

просто факт =)

[Whirlwind]

просто я к тому, что автор спрашивал "будет ли" и, учитывая, как он это описал, то он не в курсе на счёт calc(). Хотя его да, ещё нет пока что :)

[homm]

Вы не в курсе, в опере что-то подобное планируется, или может уже есть?

[habratchanka]

в опере из нового:

@media queries
text-shadow
-o-background-size
opacity
hsl colours
overflow-x & overflow-y
all css selectors
form pseudo-classes

статья тут

[habratchanka]

но expression - не самое лучшее решение

[habratchanka]

обычная сss кроссбраузерная верстка

[habratchanka]

на данный момент их нельзя нигде применить кроме вышеописанного в статье, так что ничего другого не остается, кроме JS еще конечно.

[Hitryi_Pryanik]

Нахрена константы? Посмотрел по ссылке. Достаточно грамотно написать классы и сгруппировать их.

Вот например у нас блок шапки, логотип в ней и ещё пара кусков имеют одинаковую высоту и фон.

И подвал имеет такую же высоту и цвет фона. Задали мы в 5—6 элементах свойство переменной. А потом надо разделить подвал и шапку и снова здорово…
То есть по логике шапку и вложенные элементы надо описывать в одном блоке, а подвал в другом (не зависящем).

Константы удобны только в роботизированных темах, чтобы быстро их менять. И то сгруппировать классы никто не мешает, либо писать классы так: «class="standart alt bigborder"». Пусть будут, но пока не нужны. Появятся когда во всех браузерах, тогда для них возникнут задачи. А пока всё это реализуется через скрипты на стороне сервера.

[Chupa]

Допустим у меня на странице используется три цвета шрифта. Причем использование этих цветов хаотично (не задать общий класс). Использование классов типа: big, red, border - фи...
В таких случаях очень подойдет переменная.

[arestov]

я не принял ещё какуюто из сторон, но это уже походит на ламеризацию css, деградирование. также думаю это затруднит отладку чужого кода

[Hitryi_Pryanik]

Не спорю, не сталкивался. Если есть возможность, найдётся и задача. Но я предпочитаю минимум задач и аскетичное решение.

1. Для шаблонов хорошо, не спорю. В данном случае я напишу в CSS классы через запятую и задам им цвет. А если у нас в одном шаблоне цвет фоновый, а в другом цвет шрифта, то всё равно CSS надо менять. Не вс ли равно, присваивать ли свойству значение константой или добавлять класс к общему правилу? И вообще это вопрос массовки уже. А делать стилизацию массовкой смысла нет. Можно просто делать копию и не париться. Я понимаю, что так например проще покрасить админку в фирменные цвета клиента (один фиг дизайн специально никто делать не будет). Однако можно просто заранее спланировать структуру, выявить наиболее часто повторяющиеся свойства, наиболее редко повторяющиеся. А уж пройтись автозаменой по CSS файлу — невеликий труд (и не сложнее, чем одну переменную заменить).

2. Тут согласен. Математические вычисления в любом случае гораздо удобнее проводить с переменными или константами. Но я не склонен создавать такие зависимости. Предпочитаю вложенность блоков и процентные соотношения, а так же размеры в em/ex — это тоже вычисляемые значения. Конечно таких сложных зависимостей не создашь, но мне и так достаточно. Есть конечно expression для вычислений, но пока валидным не считается.

[MichaelSorokin]

Идей переменных и констант уже реализована посредством XCSS. Т.е. суть такая что есть файлик с набором переменных для какого то скина и есть XCSS файлик, в котором содержаться маппинги CSS селекторов на скины.
Вот примерно так:

----XCSS file -----
<u:selector name=".rich-fileupload-toolbar-decor">
<u:style name="border-bottom" value="1px solid" />
<u:style name="border-top" value="1px solid" />
<u:style name="border-left" value="1px solid" />
<u:style name="padding" value="2px" />
<u:style name="background-color" skin="additionalBackgroundColor" />
<u:style name="border-bottom-color" skin="tableBorderColor" />
<u:style name="border-top-color" skin="tableBackgroundColor" />
<u:style name="border-left-color" skin="tableBackgroundColor" />
<u:style name="width" value="100%" />
</u:selector>

----Skin file----

tableBackgroundColor=#FFFFFF
tableFooterBackgroundColor=#cccccc
tableSubfooterBackgroundColor=#f1f1f1
tableBorderColor=#C0C0C0
tableBorderWidth=1px

Такой подход юзается в RichFaces для реализации скиннинга.

[Hitryi_Pryanik]

Тут всё понятно. Но скучно. Интересней если например вручную выбирать основной цвет, к нему на полуавомате пару дополнительных, а всё остальное вычисляется. Вот тогда круто.

[Over]

CSS константы реализованы в плагине nested css для Ruby on Rails. В двух словах, серверсайд эмулирует то, о чем все так давно мечтали. Да и со вложенностью работа поинтереснее.

[ATimofeev]

Константы, конечно, дело хорошее, но без примитивного ветвления толку от них мало.

[lugansk]

По мне удобнее был бы импорт классов. Напр.

.line{width:100%;height:1px}
.red{background:red}

#red_line{import:classes(line red)}