sass如何让css代码看起来高大上?

发布于 2022-09-01 12:20:02 字数 115 浏览 12 评论 0

老大之前让我学sass、compass,说sass可以让代码看起来更高大上。
但经过学习之后没有感觉到,因为sass最终还是要编译成css才能用,有时还会让代码看起来很冗余。不知各位前辈有什么感悟和建议?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

笑叹一世浮沉 2022-09-08 12:20:02

使用SASS只是为了提高编写CSS的效率,能够重复使用很多相同的样式,而且定义好变量之后,以后如果要个性的话也能够很方便,只需要个性一个变量的值,其他用到的地方就会都改变啦~

淡看悲欢离合 2022-09-08 12:20:02
//variables
$js: '../js/';
$img: '../img/';
$icons-sprite-path: '../img/';
$base-width: 1000px;
//a random id
$version: unique-id();
//top
$top-background: #f5f5f5;
$top-bottom-background: #595959;
$top-bottom-highlight-background: #cc0000;
$top-border-color: #383838;
$highlight-background: #d33737;
$table-th-background: #e5e5e5;
//button
$button-default-background: #9c9c9c;
$button-primary-background: #0776b7;
$button-lesser-background: #c4deed;
$button-danger-background: #e85151;
$button-blue-background: #a8dbf9;
$button-gray-background: #eee;
@mixin inline-block() {
display: inline-block;
*display: inline;
*zoom: 1;
}

//wrapper
@mixin wrapper($width: $base-width) {
    width: $width;
    min-width: $width;
    margin: 0 auto;
}

类似这样,到时候修改起来就很方便了。

谁人与我共长歌 2022-09-08 12:20:02

css冗余是因为你没用继承和占位符

懷念過去 2022-09-08 12:20:02

主要开始改着方便……有时候设计那边尺寸没有定下来,这时你可以大概地先把逻辑框架搭好,然后样式先弄个预设值,在确定尺寸后可以通过css预处理语言的变量绑定来快速方便地修改样式。
说到底还是会方便自己的。
我工作的地方没有要求,但是这种东西自己觉得方便了就可以了。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文