title: calc与vh、vw date: 2020 03 18 09:43:10 tags: css vh、vw 与`vw` 是一个 js 与 css耦合的单位,经常用来做响应式布局,这两个单位是 css3引入的 视口是指:浏览器可视区域 vw: 相对于视口的宽度。视口被均分为100单位的vw ...
分类:
其他好文 时间:
2020-03-18 13:13:34
阅读次数:
63
关于CSS3的object fit属性的详细理解: 对object fit属性的理解: 属性值: fill : contain: cover: none: scale down: 图片展示: 按照上面的代码依次展示 使用范围:头像等,后台传过来的数据不一致的时候; ...
分类:
Web程序 时间:
2020-03-17 19:46:34
阅读次数:
86
个人的面试踩坑之旅,充满诚意的干货~ 一:今日头条 1.用css实现一个自适应的正方形详细参考:https://idiotwu.me/css-respon... <div class="placeholder"></div> 方法1:CSS3 vw 单位 .placeholder { width: ...
分类:
其他好文 时间:
2020-03-16 15:10:48
阅读次数:
92
移动端事件有哪些: 触摸事件 手势事件 传感器事件 (后面两个兼容性不怎么样,因此重点就是触摸事件) 触摸事件: touch 事件 pointer 事件 (PC端可能会使用jQuery做动画,移动端一般不会,基本都是使用css3做动画) ontouchstart (必须在元素内部才能触发) onto ...
分类:
移动开发 时间:
2020-03-15 22:38:39
阅读次数:
107
伸缩布局 传统布局和伸缩布局 布局的传统解决方案,基于 盒装模型 ,依赖 dispaly 属性+ position 属性+ flot 属性 对于特殊布局非常不便 CSS3在布局方面做了非常大的改进 使得我们对块级元素的布局排列变得十分灵活,适宜性非常强 其强大的伸缩性,在响应式开发中发挥极大的作用 ...
分类:
Web程序 时间:
2020-03-15 22:25:57
阅读次数:
138
Android 动画解释 XML 目录 " 动漫效果" " 动画效果" " 动画效果" " 动画效果" "activity 中添加代码" 动画效果 这种动画主要实现渐出 "返回" 动画效果 这种动画主要实现从小到大缩放 "返回" 动画效果 这种动画主要是画面转换位置,从而移动的效果 "返回" 动画效 ...
分类:
移动开发 时间:
2020-03-15 22:03:14
阅读次数:
79
在处理移动端页面时,我们有时会需要将 banner 图做成与屏幕等宽的正方形以获得最佳的体验效果,如 Flipbord 的移动页面: 那么应该怎么使用纯 CSS 制作出能够自适应大小的正方形呢? 方案一:CSS3 vw 单位 CSS3 中新增了一组相对于可视区域百分比的长度单位 vw, vh, vm ...
分类:
Web程序 时间:
2020-03-15 09:20:57
阅读次数:
80
问题描述 先来一段html代码 此刻效果是正常的一倍效果 接着加入container缩放 则会出现极细致的一条白色边,原因大概就是.parent元素的border和.son的height经过缩放后不会是整数,两个数值的小数点被省去不渲染,导致两者叠加起来和真正要的效果差1px,而让.parent的背 ...
分类:
Web程序 时间:
2020-03-14 19:59:06
阅读次数:
234
简介 HSL色彩模式是工业界的一种颜色标准,是通过对色调(H)、饱和度(S)、亮度(L)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的,HSL即是代表色调,饱和度,亮度三个通道的颜色,这个标准几乎包括了人类视力所能感知的所有颜色,是目前运用最广的颜色系统之一。HSLA是在HSL的基础 ...
分类:
Web程序 时间:
2020-03-14 18:19:57
阅读次数:
118
1 <!-- 一般用作活动专题网页制作,平常不太用 --> 2 <!-- transition-property 设置过渡的属性,例如:width height background-color 3 transition-duration 设置过渡时间,比如:1s 500ms 4 transitio ...
分类:
Web程序 时间:
2020-03-14 17:07:36
阅读次数:
76