paddihng、marginなどの変数を1ずつ上げていきたい時に下記のようにxを付けるしか方法が思いつかないのですが、どのように対処していますか?

投稿者: Anonymous

paddihng、marginなどの変数を1ずつ上げていきたい時、下記のようにxを付けるしか方法が思いつかないのですが、どのように対処していますか?

1ずつ上げるまでは行わずにだいたいだけ作って
そこに当てはまらなければ、変数での指定はしないのが一般的なのでしょうか?

/* margin */
--margin-small: 2rem;
--margin-medium: 4rem;
--margin-large: 6rem;
--margin-large-x: 7rem;
--margin-large-xx: 8rem;
--margin-large-xxx: 9rem;

解決

例示のように1remずつ差をつけて使い分けることがあまりありません。
実際に例示されたように使用するのであれば、smallやmediumなどのような表現ではなくどの変数がどの値なのかわかるように命名したほうが良いのではないかと思います。

--margin-2r: 2rem; // --margin-2remの意
--margin-4r: 4rem;
--margin-5r: 5rem;
回答者: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *