LESS-ում մաթեմատիկական օպերացիաների չեղարկում

Երբեմն լինում են իրավիճակներ, երբ մենք ունենք ինչ-որ մաթեմատիկական օպերացիա, որը չպետք է ընկալվի LESS-ի կողմից որպես հաշվարկման հրաման: Օրինակ, այդպիսի խնդիր է առաջանում CSS ֆունկցիայի calc մեջ.

styles.lessdiv {
  width: calc(100% - 10px);
}

Բարեբախտաբար, LESS-ը կարողանում է ճիշտ մշակել այդպիսի տեղամասեր և չի կատարի հաշվարկ կոմպիլյացիայի ժամանակ:

Սակայն լինում են իրավիճակներ, երբ հաշվարկ չպահանջող արտահայտությունը գտնվում է այլ տեղում, օրինակ՝ փոփոխականում, ահա այսպես.

styles.less@exp: 100% - 10px;
div {
  width: calc(@exp);
}

Այս դեպքում փոփոխականի մեջ կգրանցվի հաշվարկի արդյունքը, և calc-ին կուղարկվի հաշվարկված արժեքով փոփոխականը: Որպեսզի դա չտեղի ունենա, մենք կարող ենք բացահայտորեն նշել, որ արտահայտությունը պետք է մնա անփոփոխ տեսքով:

Դրա համար անհրաժեշտ է արտահայտությունը վերցնել չակերտների մեջ և դրա դիմաց դնել թիլդայի նշան.

styles.less@exp: ~'100% - 10px';
div {
  width: calc(@exp);
}

Задание 1

Ուղղեք կոդը, որպեսզի այն սկսի աշխատել ճիշտ եղանակով.

styles.less@exp1: 80% + 10px;
@exp2: 30vh - 10px;

div {
  width: calc(@exp1);
  margin-top: calc(@exp2);
}