Tag: 上海社会科学院

与SASS作为一个单一的论点，将一个名单列入混音: 我喜欢与SASS混合使用，帮助我实现良好的跨浏览器兼容性。我想制作一个mixin，看起来像这样： @mixin box-shadow($value) { box-shadow: $value; -webkit-box-shadow: $value; -moz-box-shadow: $value; } 我可以通过这样的事情： @include box-shadow(inset -2px -2px 2px rgba(0,0,0,0.5), inset 1px 1px 2px rgba(255,255,255,0.5), inset 0px 0px 0px 1px #ff800f); 结果是这样的： box-shadow: inset -2px -2px 2px rgba(0,0,0,0.5), inset 1px 1px 2px rgba(255,255,255,0.5),inset 0px 0px 0px 1px #ff800f; -moz-box-shadow: inset -2px -2px 2px rgba(0,0,0,0.5), inset 1px […]

Sass计算百分比减px: 我希望能够做到以下几点： height: 25% – 5px; 显然，当我这样做，我得到的错误： Incompatible units: 'px' and '%'.

在Sass中使用@include和@extend？: 在Sass中，我无法区分使用@include和mixin并使用@extend和占位符类的@extend 。难道它们不是相同的东西？

为什么Sasscaching文件夹被创build: 我已经开始为我的CSS工作尝试Sass了。在我的Css文件所在的目录中，我也看到一个“.sass-cache”文件夹。任何人都可以告诉我为什么这个文件夹被创build，如果我删除它是安全的。谢谢，

用可选参数制作一个Sass混合: 我正在写这样一个mixin： @mixin box-shadow($top, $left, $blur, $color, $inset:"") { -webkit-box-shadow: $top $left $blur $color $inset; -moz-box-shadow: $top $left $blur $color $inset; box-shadow: $top $left $blur $color $inset; } 当调用我真正想要的是，如果没有$inset值传递，没有输出，而不是编译到这样的事情： -webkit-box-shadow: 2px 2px 5px #555555 ""; -moz-box-shadow: 2px 2px 5px #555555 ""; box-shadow: 2px 2px 5px #555555 ""; 如何重写mixin，如果没有$inset值传递，什么都不输出？

对主题使用@extend时出现意外的结果: 我重构了一些我的Sass代码，并且遇到了一个奇怪的问题。我的代码目前看起来像这样： // household $household_Sector: 'household'; $household_BaseColor: #ffc933; // sports $sports_Sector: 'sports'; $sports_BaseColor: #f7633e; // the mixin to output all sector specific css @mixin sector-css($sector_Sector,$sector_BaseColor) { .sector-#{$sector_Sector} { &%baseColor { background-color: $sector_BaseColor; } } } // execute the mixin for all sectors @include sector-css($household_Sector, $household_BaseColor); @include sector-css($sports_Sector, $sports_BaseColor); .product-paging { h2 { @extend %baseColor; } […]

在Sass中根据类定义variables: 我想知道是否可以在Sass中定义一个variables，取决于是否设置了类。我需要做一些字体typestesting，并希望基于主体类dynamic地改变字体variables$basicFont 。例如： $basicFont: Arial, Helvetica, sans-serif; body { &.verdana { $basicFont: Verdana, sans-serif; } &.tahoma { $basicFont: Tahoma, sans-serif; } } 有没有可能在Sass中处理这个问题？

math与插值variables？: 考虑下面的sass： $font-size: 18; $em: $font-size; $column: $font-size * 3; // The column-width of my grid in pixels $gutter: $font-size * 1; // The gutter-width of my grid in pixels $gutter-em: #{$gutter / $em}em; // The gutter-width in ems. $column-em: #{$column / $em}em; // The column-width in ems; $foo = $gutter-em / 2; // This results […]

使用SASS连接嵌套类: 我正在尝试使用SASS的嵌套function连接两个类，但不知道如何去做。这是HTML： <section class="a"> <div class="b"> <div class="c date">some date</div> </div> </section> 这是我目前的SASS： .a .c display: inline-block .date width: 50px 它创build下面的CSS： .a .c { display: inline-block; } .a .c .date { width: 50px; } 但是这不起作用。浏览器期望“date”和“string-long”嵌套在“c”类下，而不是它们都存在于同一个HTML标签上。我需要的是（ .c和.date => .c.date之间没有空格）： .a .c { display: inline-block; } .a .c.date { width: 50px; } 我该怎么做？