1.rem 适配:能够使用 rem 单位设置网页元素的尺寸
rem 单位
相对
单位- rem 单位是相对于
HTML 标签的字号
计算结果 1rem = 1HTML 字号大小
常用视口(1/10
@media (媒体特性) {
选择器 {
CSS属性
}
}
@media (width:320px) {
html {
font-size: 32px;
}
}
2.less 语法
* less 嵌套
写法生成后代选择器
- 作用:快速生成后代选择器
.父选择器 {
//父选择器样式
.子选择器 {
//子选择器样式
}
}
- 目标:能够使用
less 变量
属性值 语法
- 定义变量:
@变量名: 值;
- 使用变量:
CSS 属性: @变量名;
- 定义变量:
@color: pink;
.box {
color: @color;
}
- 导入
// 如果less文件,可以省略后缀.less
@import 'base.less';
@import 'base';
- 导出
// out: ./css/imdex.css
// out: ./css/
- 禁止导出
// out: false