![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
@codeDo
最近代码没写多少,项目管理做了不少
展开
-
在scoped 模式下 覆盖第三方组件库elementUI的样式的两种方法
在scoped模式下,组件之间的样式互不影响,但是也造成了一些问题,在当前组件想修改element组件样式的时候,你发现不好使。下面提出两种解决办法,他们把这个操作,叫做样式穿透。第一种写法:外层class >>> 组件的class这样就可以有效果啦第二种: /deep/ 组件class 如下:...原创 2020-07-21 14:51:23 · 778 阅读 · 0 评论 -
element ui tabel组件,自适应大小
场景父级div变化,tabel组件宽度不自适应变化。解决办法:在父级div加:overflow: auto;搞定。原创 2020-05-26 18:02:27 · 1077 阅读 · 0 评论 -
前端性能优化----无损压缩webp格式的图片
一、什么是webpWebP格式,谷歌开发的一种旨在加快图片加载速度的图片格式。图片压缩体积大约只有JPEG的2/3,并能节省大量的服务器宽带资源和数据空间。二、为什么要用webp1、减小图片加载资源的大小、节省用户流量资源2、降低服务器流量资源三、webp兼容性情况结果:谷歌全面支持、安卓浏览器从4.2开始支持。那么在页面中对于安卓用户中图片资源加载大小会有大幅度下降。...原创 2019-12-06 12:56:24 · 2233 阅读 · 0 评论 -
为什么要把js放在页面底部,css放在顶部
先了解一下 浏览器的渲染原理:当我们在浏览器输入URL 时,浏览器会返回我们一个HTML文档,将文档下载下来后,便开始从上到下开始解析。解析完成之后就会生成DOM。如果页面中有css,会根据css的内容生成cssom, 然后DOM会和cssom结合生成一个渲染树,最后浏览器会根据渲染树的内容,计算出各个节点的大小和位置绘制在页面上。js 会阻碍浏览器的解析,解析遇到js会停止渲染,优先...原创 2019-12-06 11:21:17 · 2956 阅读 · 1 评论 -
Css 制作div四角边框效果
<li class="inputStyle"> <span></span> <span></span> <span></span> <span></span></li>inputStyle{& span:nth-child...原创 2019-08-30 15:39:14 · 2575 阅读 · 0 评论 -
移动端滚动条 卡顿的解决办法(非常有效的解决)
body {-webkit-overflow-scrolling: touch; overflow-scrolling: touch;}原创 2019-08-12 15:40:36 · 2448 阅读 · 0 评论 -
设置 两行省略号不生效的问题
在样式中加 注释引导: overflow:hidden; text-overflow:ellipsis; display:-webkit-box; /* autoprefixer: off */ -webkit-box-orient:vertical; /* autoprefixer: on */ -webkit-line-clamp:...转载 2019-05-15 18:08:21 · 2148 阅读 · 2 评论 -
关于盒子模型 和 获取页面宽高的问题总结
写个博客也有人喷,我真的服了。自己写自己的思考笔记,爱看不看,有意见你也可以提, 毕竟我的理解也不一定对是不是。你open 我干啥子劲儿。盒子模型:标准盒子模型 和怪异盒子模型 两种。CSS3 的新属性:box-sizing:border-box(IE盒子模型 也就是怪异模型); content-box(W3C的标准盒子模型);区别:用css设置宽度、内边距、边框等属性,宽度 计算的时...原创 2019-03-24 17:19:14 · 706 阅读 · 0 评论 -
关于前端中的BFC的理解
什么是BFC?全称块级格式化上下文?什么意思不懂。看了好多博客,基本都是抄的,真心都不是大白话。我今天来总结一下,用菜鸟级别的语言来描述。BFC 应该可以抽象成一个 独立的个体,出淤泥而不染的白莲花。是的不受其他元素的影响,始终保持自己独立。就是正常的普通流布局规则,设置的样式是什么样的,就按正常的普通流布局的表现。内部的子元素 不受外界的影响,外界的元素,也不受内部的元素的影响。...原创 2019-03-27 00:07:35 · 1724 阅读 · 0 评论 -
关于media媒体查询不生效的问题原因总结
1.and 后面一定要有空格~~~ 切记2.meta 里面需要加上一句话:<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">3.代码写错了,选择器写错了,样式备覆盖了·等等低级问题,可以先在里面,写个简单的并...原创 2018-08-12 14:30:20 · 21240 阅读 · 7 评论 -
css3画三角形的原理
主要用到了CSS3 的一个transparent属性。简单介绍transparent是干嘛的:transparent 是透明的意思,在CSS3以后,支持所有的color属性画的三角形其实border的宽度加上颜色来控制的,如下图,其实三角形的形成不过是,其他的边框颜色设置成透明了而已。width: 0;height: 0;border: 82px solid;border-color: blue ...翻译 2018-07-12 15:02:05 · 457 阅读 · 0 评论 -
UC浏览器下图片不显示问题
UC这个坑壁浏览器。跟IE6有一拼,不过没关系。这个问题,就是UC浏览器把你的图片当做广告屏蔽了,可能你的图片命名,图片路径,图片父标签的class或者id包含有“ad”,字样,他就不显示。好好检查,不显示图片,就是命名的问题。...原创 2018-04-12 14:38:14 · 2218 阅读 · 0 评论