|
вопрос по использованию css, call(), attr() | ☑ | ||
---|---|---|---|---|
0
vde69
20.03.21
✎
14:53
|
html
<div class="decoration" data-d-w=3 data-d-h=5 data-d-l=1 data-d-t=1 data-d-n="Heat">-</div> css :root { --Step: 75px; } .decoration { position: absolute; left:calc(var(--Step) * attr(data-d-l)); // не работает top:calc(var(--Step) * attr(data-d-t)); // не работает float:left; overflow:hidden; width:calc(var(--Step) * attr(data-d-w) - 2px); // не работает height:calc(var(--Step) * attr(data-d-h) - 2px); // не работает border: 1px dashed red; } если пишу например так height:calc(var(--Step) * 3 - 2px); то все нормально, уже весь мозг сломал, может attr() имеют ограничения при работе с числами? |
|||
1
acht
20.03.21
✎
14:57
|
Попробуй
attr(data-d-w number) |
|||
2
vde69
20.03.21
✎
15:00
|
(1) пробовал, и integer тоже пробовал
|
|||
3
vde69
20.03.21
✎
15:18
|
нашел ответ:
Функция attr работает только в паре с content то есть ее кроме как для контекста применять никуда нельзя... печалька... |
|||
4
Вафель
20.03.21
✎
15:28
|
а что хотел то.
наверняка можно куда проще |
|||
5
Вафель
20.03.21
✎
15:29
|
если хочеь в хтмл задавать высоту, то может проще через стайл?
|
|||
6
vde69
20.03.21
✎
16:06
|
(5) мне нужен универсальный стиль. Что бы хтмл был минимальным. Ну и адаптивность...
Сейчас мне нужен div который будет по верх основного вывода |
|||
7
Василий Алибабаевич
20.03.21
✎
16:12
|
(0) Как то оно больше на LESS похоже чем на css. А оно не стандарт. Напрямую не работает. Нужно подключать правильный скрипт. Или "компиллировать" в css.
|
|||
8
vde69
20.03.21
✎
16:31
|
Наверно сделаю так
html <div class="decoration" style="--w:3;--h:5; --l:1; --t:1; --n:Heat">-</div> |
|||
9
Вафель
20.03.21
✎
16:53
|
(7) однако переменные уже давно в стандарте
|
|||
10
Вафель
20.03.21
✎
16:55
|
покажи на картинке чтотв итоге получается.
|
|||
11
Вафель
20.03.21
✎
16:55
|
может пооще грид какой или флекс?
|
|||
12
Вафель
20.03.21
✎
16:57
|
жесткое задание размеров это бэд практис
|
|||
13
Вафель
20.03.21
✎
16:58
|
а -2px лучше маржином или паддингом делать
|
|||
14
vde69
20.03.21
✎
17:36
|
||||
15
Генератор
20.03.21
✎
17:37
|
var же работает, задавай их в style, а дата атрибуты в js используют, можно написать функцию которая из data достанет и пропишет в style
|
|||
16
vde69
20.03.21
✎
17:39
|
(15) у меня очень маленький веб сервер :) вот такой https://www.chipdip.ru/product/esp-01?from=www.yandex.ru%3Bsearch%26%23x2F%3B%3Bweb%3B%3B0%3B&q=esp8266+01s&etext=2202.Wbufuyek_exviIXuZHfz6dSkcC_P3SoreYIWcm5pB21md29qaW50eGFjZmJtd293.492c4e357a1dd53bd946529af63b7de1d7f296ad&yclid=1350128676265821140&utm_source=direct&utm_medium=cpc&position_type=premium|k50id|010000001062285_Все|cid|50598766|gid|4147857258|aid|8822901982|src|search_none&utm_campaign=Y_dinamicheskaya&utm_content=text12_ya&utm_term=
так, что я борюсь за каждый байт :) |
|||
17
Генератор
20.03.21
✎
17:45
|
Всякую статику типа js css можно же на другой сервер выложить если из сети доступ есть
|
|||
18
Fragster
гуру
20.03.21
✎
21:41
|
переходи на vue, там вычисляемые стили и классы элементарно делаются
|
|||
19
Доктор Манхэттен
21.03.21
✎
05:24
|
(16) Какой-то огромный у тебя веб-сервер.
У меня вот такой: https://i.ebayimg.com/images/g/ZwkAAOSwRUNfOmTU/s-l500.jpg И памяти в нем дофига, хоть видео в 4К закачивай, все потянет. |
|||
20
Вафель
21.03.21
✎
10:23
|
а трубы как рисуешь?
|
|||
21
Вафель
21.03.21
✎
10:23
|
(18) а каков итоговый размер жс?
|
|||
22
vde69
21.03.21
✎
11:18
|
(20) я сейчас переделал, стала вообще красивенько и удобно.
Доделаю код самого сервера, выложу куда нибудь. Сейчас все файлы занимают менее 100кб |
|||
23
Fragster
гуру
21.03.21
✎
16:12
|
(21) сама либа - килобайт 40 несжатых, 25 сжатых примерно, а там как наворотишь.
|
|||
24
Fragster
гуру
21.03.21
✎
16:12
|
третья версия, вроде, поменьше, но там ие11 не завезли
|
|||
25
Fragster
гуру
21.03.21
✎
16:13
|
да и всякие уикиты пока тоже не все обновились
|
Форум | Правила | Описание | Объявления | Секции | Поиск | Книга знаний | Вики-миста |