qw789 / blogs

生活中的记录
2 stars 2 forks source link

css布局 #5

Open qw789 opened 7 years ago

qw789 commented 7 years ago

1.消除inline-block间隙。给其父元素设置font-size:0

qw789 commented 6 years ago

函数节流最简单代码 var resizeTimer = null; window.onresize=function(){ if (resizeTimer) { clearTimeout(resizeTimer) } resizeTimer = setTimeout(function(){ initChars(); }, 400); }

qw789 commented 6 years ago

button 默认type是submit

qw789 commented 6 years ago

iconfont矢量图标的优点:

加载文件体积小。 可以直接通过css的font-size,color修改它的大小和颜色,对于需要缩放多个尺寸的图标,是个很好的解决方案。 支持一些css3对文字的效果,例如:阴影、旋转、透明度。 兼容低版本浏览器。 缺点:

矢量图只能是纯色的。 制作门槛高,耗时长,维护成本也很高。

qw789 commented 6 years ago

滚动条宽度基本都是17px

qw789 commented 6 years ago

Chrome浏览器下自动填充的输入框背景会变成黄色,如果觉得不好看想要去掉,可以试试使用下面CSS:input:-webkit-autofill { -webkit-box-shadow: inset 0 0 0 1000px #fff; background-color: transparent; } ​​​​

qw789 commented 5 years ago

html,body{height:0;} div{positon:absolute;height:100%} 这句有效!!!!

qw789 commented 5 years ago

document.defaultView.getComputedStyle() window.getComputedStyle()

qw789 commented 5 years ago

window.screen.width 在手机端 获取到的是逻辑分辨率的宽度

想知道物理分辨率的话, window.screen.width * window.devicePixelRatio

不知道什么叫逻辑分辨率和物理分辨率的话自行百度 网页可见区域宽: document.body.clientWidth