
css
爱吃白米饭的饭饭
只有在泥泞的道路上才能留下脚印
展开
-
object-fit 切换被替换元素的内容对象在元素框内的对齐方式。
https://developer.mozilla.org/zh-CN/docs/Web/CSS/object-fit原创 2020-04-22 17:33:55 · 274 阅读 · 0 评论 -
解决问题之一:font-size 影响页面布局
为实现效果如下:遇到的问题:实现方法,border bottom+right 然后 nth(4n)没有没有 right但是这样会造成一个问题div之前会有空隙,如下图:为什么会遇到这个问题,怎么解决?原因:因为页面默认的font-size字体大小影响了解决:重置body,html{font-size:0}或者可以直接在当前元素的父元素设置font-size:0,因为全局设置可能会...原创 2019-04-26 15:41:52 · 2372 阅读 · 0 评论 -
px 、em 、rem各单位换算
相同点:都是长度单位异同点:px:(像素)的值是固定的,指定是多少就是多少,计算比较容易。em:值不是固定的(弹性布局),并且em会继承父级元素的字体大小。rem: 与em相同都是相对单位,只是他的相对仅仅针对html而言。各单位换算:em计算方法:1 ÷ 父元素的font-size × 需要转换的像素值 = em值备注: 浏览器的默认字体高都是16px。所...原创 2019-04-18 15:07:13 · 1271 阅读 · 0 评论 -
超出文本溢出省略号
方法一:超出一行省略// A code block.text{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}方法二:超出多行省略(设置行数)// A code block.text{ overflow: hidden; text-overflow: ellipsis; ...原创 2019-05-08 11:30:55 · 224 阅读 · 0 评论 -
解决问题之二:css排版,div内的P标签内的文字字数不一致时,会导致整个div容器掉下来,不对齐
问题现象bug出现的效果(即:展示形式)没有对齐在一个水平线解决方式:在设置display: inline-block;的容器同时设置vertical-align: top;课外拓展知识:原创 2019-05-10 11:40:58 · 1395 阅读 · 0 评论 -
回到页面顶部
实现效果:点击向上箭头回到顶部实现方式:// html结构<div class="suspension"><!-- 在线咨询 --> <div class="consultation"> <img src="assets/images/cut-icon_slices/cut_homepage_kefu.png" alt=""&g...原创 2019-05-24 14:20:29 · 282 阅读 · 0 评论 -
解决问题之四:transform的rotate在内联元素上面不起作用
想让箭头旋转向上问题:直接引用transform: rotate(270deg);不起效解决:加入display: inline-block;产生原因:内联元素使用transform的rotate属性不起作用,这时可以将元素设置为inline-block或者block...原创 2019-05-24 10:09:11 · 3732 阅读 · 0 评论 -
各类资源地址管理
1、自动滚动用户信息–例:月度锦鲤https://github.com/wj704/vue-marquee-ho/tree/master/src原创 2019-06-25 17:09:32 · 255 阅读 · 0 评论