我的sass代码中包含以下mixin,以获取可自动调整大小的字体大小:
value.indexOf(...)
我定义了一些变量来保持其清洁:
@mixin fluid-text($min-screenwidth, $max-screenwidth, $min-fontsize, $max-fontsize){
font-size: calc( (#{$min-fontsize}) +
(#{$max-fontsize} - #{$min-fontsize}) *
(100vw - #{$min-screenwidth}) /
(#{$max-screenwidth} - #{$min-screenwidth}));
}
最后我在h1标题上将此混音称为:
//text variables
$min-screenwidth: 480px;
$max-screenwidth: 1260px;
//heading
$min-landingheading-fontsize: 42px;
$max-landingheading-fontsize: 65px;
由于我没有语法错误,因此不会出现我想要的样子。我读了一些有关calc的文章,有些人说calc在计算这类事情方面并没有得到改善。我简直不敢相信,因为我从演示文稿(https://youtu.be/Wb5xDcUNq48?t=1085)中获得了确切的语法
非常感谢您的帮助和麻烦。
MS
答案 0 :(得分:0)
font-size: calc( (#{$min-fontsize}px) + (#{$max-fontsize} - #{$min-fontsize}) * (100vw - #{$min-screenwidth}px) / (#{$max-screenwidth} - #{$min-screenwidth}));
//text variables
$min-screenwidth: 480;
$max-screenwidth: 1260;
//heading
$min-landingheading-fontsize: 42;
$max-landingheading-fontsize: 65;
谢谢大家!