Utilisation de Tout comme: p> mais plutôt comme ceci: p> CSS, moins ou Sass code> Pouvez-vous affecter la même valeur à 2 propriétés CSS à la fois?
.c1, c2 {idableValue} code> p>
5 Réponses :
Je ne pense pas que vous puissiez dans la manière dont vous avez décrit, vous auriez besoin d'utiliser une variable. Cependant, vous pouvez obtenir quelque chose de similaire avec des propriétés qui partagent la même espace de noms.
.funky { font: { family: fantasy; size: 30em; weight: bold; } }
Vous ne pouvez pas faire cela avec CSS.
Le moyen le plus simple de le faire est d'utiliser une variable. Voici comment vous feriez cela en moins p> et la même chose dans SASS P> @props: background-color, color;
@val: red;
@val2: green;
.properties {...}
.demo {
border-color: @val2;
.properties(@props, @val)
}
.demo2 {
.properties(@props, @val2)
}
Modifier: sur la deuxième pensée, je préfère ... @ i: 1) Quand (@i <= longueur (@properties)) {@property: extraire (@properties, @i); ... code >
Si votre navigateur prend en charge Propriétés personnalisées (AKA CSS variables) Vous pouvez définir une propriété personnalisée pour la réutilisation:
.foo { $example: red; background-color: $example; color: $example; }
in Stylus est possible de faire la recherche propriété em>, ce qui vous permet de Utilisez les propriétés de l'ancêtre parent actuellement ou la plus proche et utilisez-la pour les calculs. Pour votre cas spécifique, vous pouvez écrire: P> .demo {
color: red;
background-color: red;
}
"Mais actuellement, il n'est pas prévu de le développer" - en fait Il est mis en œuvre plus il y a un an. Il n'est tout simplement pas assez de ressources humaines pour polir bientôt toutes les nouvelles fonctionnalités de la libération v3.
Ops Désolé, je ne le savais pas. J'espère que la nouvelle version V3 arriverait à court de temps
avec stylet Vous pouvez faire de cette façon en utilisant itération et .modal
position : absolute
for bord in top bottom left right
{bord}: 1em
for larg in width min-width height min-height
{larg}: auto
for maxl in max-width max-height
{maxl}: none
Eh bien, vous pouvez attribuer
Samevalue code> à une variable et utiliser cette variable pour vos deux propriétés - mais je ne pense pas que cela puisse être fait comme vous l'avez écrit.
Moins:
@ c1: rouge code>
@ c2: @ c1 code>, identique en sass:
$ C1: rouge code>
$ C2: $ C1 code>. Dans Stylus, vous pouvez obtenir la valeur d'une autre propriété: stylus-lang.com/docs /variables.html#Property-lookup . Dans CSS, vous avez
CurrentColor code> et des propriétés personnalisées pour obtenir quelque chose de similaire