sass - 使用 Compass/sass 进行百分比宽度响应式布局?

标签 sass responsive-design compass-sass

我正在尝试使用 Sass(和 Compass)来简化百分比宽度布局的创建。

使用 target/context=result 的 A List Apart 中的公式,其中上下文为 980px,设计宽度为 640px,我尝试执行以下规则

#leftcol {
width: ((640/980)*100%);
}

编译成
#leftcol {
  width: 65.306%;
}

有没有比不一遍又一遍地输入更简单的方法?

最佳答案

不需要混合。 Sass 有一个内置的百分比函数,可以接受多种单位。

width: percentage(640 / 980)
width: percentage(640px / 980px)

两者都导致:
width: 65.30612%

关于sass - 使用 Compass/sass 进行百分比宽度响应式布局?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10822637/

相关文章:

html - 如何为几种字体类型之一使用链接预加载

ruby - 如何在 sass 上启用调试,以便我可以使用 firesass?

jquery - 基于媒体查询和视口(viewport)大小运行 Jquery 函数

ruby - 尝试运行 compass create - 找不到 Gemfile 错误

ruby-on-rails - 带有 bootstrap-sass 的颜色变量

css - 如何在网格内放置边框?

html - 响应式 - 图片上的文字

javascript - 如何更改显示图像的 div 的大小

ruby-on-rails - Ruby 哈希可以包含在 Sass 和 CoffeeScript 中,从而允许共享数据吗?

css - CompassSusy 嵌套网格未提供正确的列宽/边距