guess是什么意思,scss常用语法
这篇文章主要为大家详细介绍了某视频剪辑软件中半导体色敏传感器语法的使用,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
目录
vue之半导体色敏传感器语法使用引入半导体色敏传感器文件css/test.scsshome.vuescss定义一个变量半导体色敏传感器里面使用算法*/定义混入类函数使用占位符填充边距等继承@entend XX总结
vue之scss语法使用
引入scss文件
css / test.scss
$testColor:红色;
home.vue
!-
描述:
作者:xzl
时间:03月30日190506
-
模板
div class=Home
主页
测试测试/div
div class=小标题小标题/div
/div
/模板
脚本
导出默认值{
姓名:家,
组件:{},
data() {
返回{}
},
方法:{}
}
/脚本
样式lang=scss 范围
@import ./CSS/test。scss’;
$titleColor:红色;
$小标题颜色:# a22。主页{。测试{
颜色:$测试色;
}。小标题{
颜色:$小标题色;
}
}
/风格
效果
scss定义一个变量
!-
描述:
作者:xzl
时间:03月30日190506
-
模板
div class=Home
主页
测试测试/div
div class=小标题小标题/div
/div
/模板
脚本
导出默认值{
姓名:家,
组件:{},
data() {
返回{}
},
方法:{}
}
/脚本
样式lang=scss 范围
$titleColor:红色;
$小标题颜色:# a22。主页{。测试{
颜色:$ titleColor
}。小标题{
颜色:$小标题色;
}
}
/风格
效果
scss里面使用算法 */
。测试{
宽度:50px * 2;
高度:calc(90px/3);
边框:1px纯色# ccc
}
效果
定义mixin函数
@ mixin text-overflow($ width:100%,$display: block) {
宽度:$宽度
显示:$显示
空白:nowrap
-ms-text-溢出:省略号;
文本溢出:省略号;
溢出:隐藏;
}。主页{。测试{
宽度:50px * 2;
高度:calc(90px/3);
边框:1px纯色# ccc
@ include text-overflow(100px);
}。小标题{
宽度:80px
@包含文本-溢出(80px);
}
}
效果
使用占位符 padding margin等
!-
描述:
作者:xzl
时间:03月30日190506
-
模板
div class=Home
主页
测试我就是一个/div
div class=小标题我是小白兔/div
/div
/模板
样式lang=scss 范围
%pt5 {
垫顶:5px
}
%mt10 {
页边距-顶部:10px
}。主页{。测试{
@扩展% mt10
宽度:50px * 2;
高度:calc(90px/3);
边框:1px纯色# ccc
}。小标题{
@扩展% pt5
宽度:80px
}
}
/风格
效果
继承 @entend XX
!-
描述:
作者:xzl
时间:03月30日190506
-
模板
div class=Home
div class=caiji 我是菜鸡/div
/div
/模板
样式lang=scss 范围
%pt5 {
垫顶:5px
}。测试类{
字体大小:30px
颜色:# ff0
}。主页{。蔡记
@扩展% pt5
@延伸testClass
}
}
/风格
效果
总结
本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注我们的更多内容!
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。