Question

我正在尝试合并这个sass代码，但它没有发生，请告诉我如何实现它的过程。

@charset "utf-8";
/* CSS Document */

h1 { color:#0ec3f7;}

$divColor : #f8f9be;
$borderStyle : dotted;
$width : 700px;
$height : 200px;

#first {background-color:divColor; border:1px borderStyle #F00; width:width; height:height;}

这是html文件

<html xmlns="http://www.w3.org/1999/xhtml">
<head>    
<title>css-saas-less</title>
<link rel="stylesheet" href="sasstemp.scss"  />    
</head>    
<body>   
<h1> CSS preprocessors </h1>

<div id="first">welcome to sass.....
</div></body>
</html>

Answer 1

你必须使用app将你的sass代码转移到css

f.e。 http://mhs.github.io/scout-app/（免费，窗口）或 http://compass.handlino.com/（窗口）

，您的代码应如下所示

<强> stylesheet.sass：

$divColor: #f8f9be
$borderStyle: dotted
$width: 700px
$height: 200px

#first 
    background-color: $divColor
    border: 1px $borderStyle #F00
    width: $width
    height: $height

（ no {}或; ）

了解更多信息，请访问http://sass-lang.com/tutorial.html

或来自Jeffrey Way的精彩视频教程：http://net.tutsplus.com/sessions/mastering-sass/

Answer 2

<link rel="stylesheet" href="sasstemp.scss"  />

这假设就像

<link rel="stylesheet" href="sasstemp.css"  />

否则在你的系统上安装所有需要ruby的拳头然后你需要安装sass gem。请查看http://sass-lang.com/tutorial.html以获取帮助。

如何实现sass代码

2 个答案: