使用scss不但可以实现选择器的嵌套,属性也可以进行嵌套。

  首先看一段代码实例:

nav {
border-style: solid;
border-width: 1px;
border-color: #ccc;
}

  在scss看来,上面的代码也是可以进行简化的,代码如下:

nav {
border: {
style: solid;
width: 1px;
color: #ccc;
}
}

  规则如下:

  (1)把属性名从中划线-的地方断开。

  (2)在根属性后边添加一个冒号:紧跟一个块,把子属性部分写在这个{ }块中。

  再来看一段代码实例:

nav {
border: 1px solid #ccc;
border-left: 0px;
border-right: 0px;
}

  上面的css代码可以使用scss改造如下:

nav {
border: 1px solid #ccc {
left: 0px;
right: 0px;
}
}

scss-嵌套属性的更多相关文章

  1. 【Head First Servlets and JSP】笔记22:直接从请求到JSP & 获取Person的嵌套属性

    直接从请求到JSP,不经过servlet <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  2. spring BeanWrapperImpl方便的嵌套属性(list)操作

    beans 包主要提供了接口和类用于处理java beans.     其中最主要的接口是BeanWrapper:     Spring 的中心接口,用于访问javabeans 的低层操作.默认实现为 ...

  3. ActiveRecord Nested Atrributes 关联记录,对嵌套属性进行CURD

    设置了Nested attributes后,你可以通过父记录来更新/新建/删除关联记录. 使用: #accepts_nested_attributes_for class method. 例如: cl ...

  4. 动态生成具有嵌套属性的linq选择(select)

    class SelectItem { public string Item { get; set; } } class SelectList { public int ID { get; set; } ...

  5. sass基础篇

    scss的语法非常简单: $color: red; div{ color: $color; } 这就是一个简单的scss代码. 但是,使用 Sass 进行开发,那么是不是直接通过“<link&g ...

  6. scss 初学笔记 一 变量声明 默认的样式 嵌套

    $width: 300px !default; $:          变量声明符号; width:    变量名称; 300px:   赋予变量的值; !default  代表默认样式 !defau ...

  7. 前端编码规范(4)—— CSS 和 Sass (SCSS) 规范

    CSS and Sass (SCSS) style rules ID and class naming ID和class(类)名总是使用可以反应元素目的和用途的名称,或其他通用名称.代替表象和晦涩难懂 ...

  8. SCSS(SASS、CSS)学习

    看的这篇文章 http://www.frostsky.com/2014/07/sass-scss/ 写的还比较清晰 SASS是CSS3的一个扩展,增加了规则嵌套.变量.混合.选择器继承等等.通过使用命 ...

  9. Sass变量、嵌套

    声明变量定义变量的语法Sass 的变量包括三个部分: 声明变量的符号“$” 变量名称 赋予变量的值简单的示例,假设你的按钮颜色可以给其声明几个变量: $brand-primary : darken(# ...

  10. scss 学习笔记

    由于没有办法在网络上找到适合顾客的模板,同时之前自己写css也没有很好的管理方式,最终选择了scss. Nested #main p { color: #00ff00; width: 97%; .re ...

随机推荐

  1. C#/ASP.NET对URL中的中文乱码处理

    前言:UTF-8中,一个汉字对应三个字节,GB2312中一个汉字占用两个字节. 不论何种编码,字母数字都不编码,特殊符号编码后占用一个字节. 1.直接在C#后台编码URL参数 引用类库:System. ...

  2. bash: ./AdobeAIRInstaller.bin: No such file or directory

    # chmod a+x AdobeAIRInstaller.bin # ./AdobeAIRInstaller.binbash: ./AdobeAIRInstaller.bin: No such fi ...

  3. Spring学习笔记(五)—— Spring整合JDBC

    一.Spring对JDBC的支持 Spring提供了很多模板整合Dao技术 与JDBC的整合中,Spring中提供了一个可以操作数据库的对象——JdbcTemplate,该对象封装了JDBC技术,与D ...

  4. 网络编程之socket(TCP,UDP)

    socket层 tcp协议和udp协议 1)Socket服务器编程 主要包括下面的几步: 1.打开socket 2.绑定到一个地址和端口 3.侦听进来的连接 4.接受连接 5.读写数据 (2)Sock ...

  5. java 常用模块代码

    1.文件的读写操作 (1)进行读操作 import java.io.BufferedReader; import java.io.FileNotFoundException; import java. ...

  6. BZOJ - 1497 最小割应用

    题意:基站耗费成本,用户获得利益(前提是投入成本),求最大获利 最小割的简单应用,所有可能的收益-(消耗的成本/失去的收益),无穷大边表示冲突,最小割求括号内的范围即可 #include<ios ...

  7. UVA - 11825 状压DP

    该题目是EMAXX推荐的练习题,刘汝佳的书也有解说 如果S0属于全集,那S0就可以作为一个分组,那么S分组数可以是best{当前S中S0的补集+1} 对于集合类的题目我觉得有点抽象,希望多做多理解把 ...

  8. web 导出数据到 exls 中

    // 文件下载:导出excel表 @RequestMapping(value = "/exportExcel", method = {RequestMethod.GET}) @Re ...

  9. 移动端bug和优化

    1.字体兼容bug 描叙:ios默认字体和andriod不一样,需要设置html的默认字体样式例子:font-family: PingFang-SC-Regular,Helvetica,sans-se ...

  10. 【实战】简述一次挖XSS的经历

    值守尤其是夜班真的是件痛苦的事情呀,献给还在值守岗位上奋斗的小伙伴们. 简单试了前面几个参数,发现c0-id这个参数值在响应包里有回显,截图如下: 把c0-id参数值改为xss,响应包内容也随之变化, ...