css
不可挽回的世界
这个作者很懒,什么都没留下…
展开
-
滚动条的使用
滚动条需要父盒子有固定的高度宽度,而且父盒子内的内容超过固定的高度宽度并使用overflow:auto,就能在相应的位置出现滚动条原创 2022-04-07 09:52:21 · 192 阅读 · 0 评论 -
样式穿透的使用细节
无论是使用/deep/还是::v-deep进行样式穿透时,只需要找到该组件最上层的样式加上/deep/和::v-deep,下层样式不用加,会造成穿透失效。原创 2022-02-24 16:26:12 · 143 阅读 · 0 评论 -
关于vue-cli中~和~@的区别
@是自定义路径,一般默认为src,在webpack.base.conf.js或vue.conf.js中配置@与~都是 路径别名,方便我们引用文件。@主要使用在js与html内,~则是在@之前添加,即 @,@在<style></style>中的css样式里识别不了,需要用@。...原创 2021-12-24 10:29:13 · 883 阅读 · 0 评论 -
flex布局的一些特性
我们在给主体盒子加背景图片的时候会注意到,如果主体盒子没有设置宽高,而里面的盒子设置了外边距,那么背景图就会空出外边距的部分。 但flex布局中会自动填补外边距的空缺。原创 2021-10-14 09:14:27 · 173 阅读 · 0 评论 -
浮动元素的外边距
浮动元素并不能作为相邻元素margin的参照物,它们只会寻找上一个参照物,但浮动元素可以当作浮动元素的参照物。原创 2021-09-19 14:12:51 · 441 阅读 · 0 评论 -
浮动的清除
浮动在带来方便的同时也给我们的布局带来了困难,为了消除不好的影响,我们需要动用一些方法来清除浮动造成的影响。给父盒子设置高度 :这个适用于父盒子内的元素已经全部脱离文档流,这时父盒子高度会变为0,而后面的元素也会占据脱离元素的位置,但由于脱离文档流会提高元素层级,所以后面元素会被脱离元素覆盖。解决这个问题的办法就是给父盒子设置高度。使用clear:适用于清除给浮动元素后面的元素加上clear:both;就可以清除浮动元素对它造成的影响,不会占据浮动元素的位置。使用::after伪元素:原创 2021-09-18 20:29:06 · 72 阅读 · 0 评论 -
css的盒子外边距margin会重叠
在css里有一个奇怪的特性,就是两个或多个盒子(可能相邻也可能是父子)的相邻边界(其间没有任何非空内容、补白、边框)重合在一起而形成一个单一边界。相邻盒子边界的计算方式:全部都为正值,取最大者不全是正值,则都取绝对值,然后用正值的最大值减去绝对值的最大值没有正值,则都取绝对值,然后用0减去最大值。解决方法:任意一个盒子触发bfc;两个盒子统一用margin-top或margin-bottom父子盒子边界的计算方式父盒子如果没有border和padding的话,子盒子的margin会传递给原创 2021-09-16 18:25:11 · 374 阅读 · 0 评论 -
浮动元素与定位元素的关系
<style> .a { /* float: left; */ height: 100px; width: 100px; background-color: aqua; } .b { position: absolute; height: 100px; width: 100px; background-color: red; }</style><body> <div class=转载 2021-09-16 13:20:44 · 212 阅读 · 0 评论