![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
我胖虎不答应!!
工作、学习、记录、进步
展开
-
css实现动画效果代码记录,补习css3布局、定位、动画以及transform、filter等css3属性
效果图本来是一个动图的,不会gif将就用…HTML代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"原创 2022-04-01 17:29:07 · 753 阅读 · 0 评论 -
h5移动端 rem适配 设置根元素字体大小的js方法
h5移动端 rem适配 设置根元素字体大小scale 的值表示px与rem之间的比例,例如 scale = 10 时 1rem = 10px 、scale = 100 时 1rem = 100px!function (window) { console.log(414) /* 设计图文档宽度 */ var scale = 10 var docWidth = 414; var doc = window.document, docEl = doc.documentElement,原创 2021-07-30 15:26:51 · 1084 阅读 · 0 评论 -
CSS图片居中显示 超出div容器高度度隐藏 css3 object-fit
CSS图片居中显示 超出div容器高度度隐藏 图片高度低于div容器高度上下留白显示通过固定容器的宽高加上flex布局实现.el-image{ width: 100%; height: 26rem; display: flex !important; justify-content: center; align-items: center;}.el-image > img { width: 100%; height: auto;}效果...原创 2021-07-30 09:47:40 · 1067 阅读 · 0 评论 -
css div设置多张背景图
css div设置多张背景图效果通过background-position与background-size调整大小与位置,按照顺序的url对应相应的属性值用逗号隔开background-image: url(./image/t4.png),url(./image/t3.png),url(./image/t2.png),url(./image/t1.png);// w h,w h,..background-size: 52% 11vw,100% 35vw,100%,100% 106vw;原创 2021-07-20 22:00:55 · 709 阅读 · 0 评论 -
一个VUE已成型的项目自适应多种屏幕分辨率不是办法的办法
VUE已成型的项目改成自适应多种分辨率 尝试过一些 插件 lib-flexible px2rem-loader postcss-pxtorem等等 感觉对pc端且已成型的项目不怎么友好,各种配置报错,又搞不懂。。。。就想了个蠢办法来实现 当然能达到这种效果全部归结于 直接把html根元素的字体大小设置为1px 哭了。。。在工具函数文件夹下创建rem.jsrem.js// 基准大小const baseSize = 1// 设置 rem 函数function setRem () { // 当前原创 2021-03-12 14:12:38 · 939 阅读 · 0 评论 -
css使元素垂直水平居中以及修改组件库的样式
记录在项目中遇到使用css让块元素 在父元素中上下左右居中显示text-align: center;position: absolute; 元素居中显示cssleft: 50%;top: 50%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%)原创 2020-09-02 18:23:47 · 483 阅读 · 1 评论 -
css 相对父元素固定定位
css 相对父元素固定定位父级设置了transform,perspective,filter且不为none,那么它的子孙元素就会相对于这个父级进行固定定位.父元素样式transform: scale(1, 1);//加入transform样式之后子孙元素就可以相对于父元素固定定位...原创 2020-10-27 16:41:06 · 2435 阅读 · 4 评论