Публикации по теме 'css-variables'
Angular — Утилита CSS-переменных
В каждом Front-End проекте вместо CSS я использую SCSS (CSS со сверхспособностями), потому что возможностей SCSS много и они полезны в крупномасштабных приложениях.
Одной из моих любимых функций являются переменные SCSS, которые помогают вам с шаблоном DRY (не повторяйтесь). Но недостатком является то, что эти переменные недоступны из JavaScript.
Эту проблему можно решить с помощью переменных CSS, также известных как пользовательские свойства CSS.
Переменные CSS — это объекты,..
Вопросы по теме 'css-variables'
Переменные CSS с URL-адресом фонового изображения
Я неправильно понимаю возможности переменных css? Я пытаюсь передать URL-адрес фонового изображения в переменную, подобную этой: Кажется, он работает нормально, когда я передаю что-то простое, например, цвет и т. Д.
:root {
--slide-1:...
26152 просмотров
schedule
19.11.2022
Использование Polymer.updateStyles с миксином @apply
У меня есть динамическое приложение Polymer 2.0, но оно не работает с @apply .
У меня есть переменные CSS и миксины:
<custom-style>
<style>
html {
--content-background-colour: #fff;...
345 просмотров
schedule
25.01.2023
Как заставить переменную CSS быть целочисленной в Sass?
Простите, если это простой вопрос, но я борюсь с этим на CodePen и понятия не имею, что происходит.
У меня в коде:
:root {
--ile: 10;
}
@for $i from 0 to (var(--ile)) { }
Проблема в том, что Codepen утверждает, что var(--ile) не является...
2216 просмотров
schedule
07.12.2022
Как присвоить значение переменной CSS переменной или выражению scss
Я пытаюсь построить свою собственную крошечную масштабируемую сетку в CSS/scss. Пока нашел такое решение:
:root {
--page-width: 1170px;
--gutter: 15px;
--columns: 12;
}
.wrapper {
max-width: var(--page-width);
margin-right: auto;...
4795 просмотров
schedule
05.11.2022
Angular: используйте Renderer 2 для добавления переменной CSS
Можно ли добавить переменную css встроенного стиля, используя Renderer2 ?
Я пробовал следующее, но это не работает.
import { Component, OnChanges, Output, ViewChild, Renderer2, ElementRef, ViewEncapsulation } from '@angular/core';...
3406 просмотров
schedule
24.10.2022
Можно ли выразить рекурсивную переменную в css?
Для html:
<body>
<div>
<div>
<div>
...
</div>
</div>
</div>
</body>
Есть ли способы создать рекурсивную переменную, которая использует значение своего родителя:
body >...
764 просмотров
schedule
06.07.2023
Можно ли использовать переменные CSS для изменения содержимого TITLE (описание при наведении) объектов SVG?
Можно ли использовать переменные CSS (аналог, например, opacity в style="opacity:var(--QQQ_SOMETHING_AAA, 1)" и .ZZZ_RECTANGLES{--QQQ_SOMETHING_AAA: 0.7;} для настройки содержимого SVGS TITLE (описание при наведении <title></title>...
69 просмотров
schedule
24.01.2023
Возможно ли объявление пользовательских свойств CSS ключами вместо значений?
Допустим, у меня есть большой проект, и я собираюсь много раз настраивать элемент в этом проекте, поэтому каждый раз мне нужно заходить в CSS и объявлять этот элемент по его идентификатору или классу и начинать настройку.
#elemen{...
Так что,...
31 просмотров
schedule
29.09.2022
Как поменять местами значения двух переменных CSS?
Допустим, у меня есть две переменные css, control-color и control-color-inverse . Я хочу сделать <div> , где все цвета инвертированы. Но это, похоже, не работает должным образом:
* {
background-color: var(--control-color);...
116 просмотров
schedule
21.03.2024
Использование переменных css в функциях sass - node-sass
Я пытаюсь использовать переменные CSS в проекте Angular вместе с функциями Sass ( lighten() / darken() , если быть точным), и, насколько мне известно, последняя версия LibSass позволяет это.
Я установил [email protected] и [email protected] (и...
3910 просмотров
schedule
08.06.2023
Использование переменной css в HTML-шаблоне Angular?
У меня есть компонент, который устанавливает цвет фона div на основе значения, хранящегося в файле json, который я затем просматриваю, чтобы показать кучу образцов цвета.
<div class="color-swatch-color"...
3405 просмотров
schedule
15.05.2022
Angular 7 SCSS не сохраняет пользовательские свойства CSS
Я пытаюсь использовать пользовательские свойства CSS в своем приложении Angular 7, но сталкиваюсь с проблемами, когда построение до css избавляет от свойства, для которого задана переменная CSS.
СКСС
:root {
--my-test-var: red;
}...
311 просмотров
schedule
24.11.2023
Как применить непрозрачность альфа-канала к значению цвета в переменной SASS?
У меня есть эта цветовая переменная в корневом псевдоклассе
:root {
--color-tertiary-light : #2998ff;
}
Это работает background-color: var(--color-tertiary-light);
но мне нужна прозрачность, так как rgba дает но это не работает...
15 просмотров
schedule
28.10.2022
css переменная - значение по умолчанию для var не передается
Я получаю 2 разных вывода для кода ниже. Он должен дать тот же результат, поскольку значение по умолчанию должно приниматься переменной css. Ниже приведен код, в котором я прокомментировал передачу span значения, поскольку оно имеет значение по...
162 просмотров
schedule
01.04.2023
Перезаписать переменные css
У меня есть компонент, который объявляет и использует переменную css --test: red
Но я хочу повторно объявить эту переменную с новым цветом вне этого компонента.
https://stackblitz.com/edit/js-va9k9q?file=style.css
Правильно ли это правило?...
34 просмотров
schedule
09.09.2022
Стиль вложенного веб-компонента, в котором дочерний элемент может быть того же типа, что и родительский, но требует других стилей.
Я разработал веб-компонент HTML со слотом, который использует атрибут HTML theme , чтобы разрешить интервалы между дочерними элементами (путем применения к ним margin ). Я хочу управлять размером интервала с помощью настраиваемого свойства CSS...
65 просмотров
schedule
02.08.2022
URL-адрес пользовательского свойства CSS не работает в Asp .Net
Я пытаюсь стилизовать некоторые карты в проекте mvc, и у меня есть пользовательское свойство (переменная) в моем файле css --bg-img, как показано:
background-image: linear-gradient(rgba(0, 0, 0, var(--bg-filter-opacity)), rgba(0, 0, 0,...
54 просмотров
schedule
08.10.2023
