css
子义间
我很懒,什么都不想写
展开
-
z-index的理解
z-index的理解 只有定位元素(position:relative/absolute/fixed/sticky)的z-index才有作用 <style> .main{ position: relative; width: 500px; height: 500px; } .son{ position: absolute; width: 200px; height:200px; z-index: 10; background: red; top: 0; left: 0;原创 2021-09-06 17:00:50 · 212 阅读 · 0 评论 -
scss 的基本使用
使用变量 SASS通过$符号去声明一个变量,来存储需要复用的信息 $variable-color: #333; .main { color: $variable-color; } 编译后产生的CSS代码 .main { color: #333; } 嵌套 以嵌套的方式使用CSS,但是过度的使用嵌套会让产生的CSS难以维护 .main { ul { margin: 0; padding: 0; } li { display: inline-block; } a原创 2021-09-01 15:04:21 · 203 阅读 · 0 评论 -
移动端的宽高随着分辨率的变化对应变化
移动端的宽高随着分辨率的变化对应变化,比如说要在移动端画圆,但是怎么样让他的宽高比例一致呢,如果用rem来对圆的半径,那么无非就是定死半径了,用百分百是不能适配各移动端的。 如果在一个div里平均显示两个圆并且这两个圆半径相同,无非就是宽高相同而且随着屏幕的大小的变化进行半径变化,一般来说可以是这样 一个大div中2个小div,这两个小div宽是大div的50%,高度呢就无法设置了,因为高度用百分比的话相对的父级的,但是父级默认是被子级撑开的,所以百分百是不行的,写多少百分比高度都是为0,但是默认的padd原创 2020-06-11 18:53:49 · 438 阅读 · 0 评论 -
display: inline-block的一些问题
在设置display: inline-block时这样可能会出现两个div顶端不对齐的情况,可以在右侧div设置vertical-align: top;即可以解决此问题原创 2019-09-09 17:25:45 · 348 阅读 · 0 评论