html
FE-阿阳
爱学习的程序猿
展开
-
部分文字高亮方案
部分文字高亮原创 2022-10-18 21:38:15 · 367 阅读 · 1 评论 -
取消 input 的浏览器文本框的自动提示
问题描述项目中需要取消 input 自动带出的浏览器文本框的自动提示,如下图解决方案给 input 设置 autoComplete=‘off’,可以取消自动提示<Input placeholder="请输入类目名称" autoComplete={'off'} maxLength={500} />...原创 2021-10-19 19:21:35 · 3448 阅读 · 0 评论 -
antd 中 Tooltip 组件设置偏移量
antd 中 Tooltip 组件设置偏移量问题描述后台的平台用到 antd 的比较多,Tooltip 也是比较常用的组件之一,Tooltip 的 placement 属性支持设置提示的位置,但是有时候 UI 那关还是过不去,想要增加一点偏移量,就需要折腾一番。解决方案由于 Tootip 是动态设置的位置,所以设置的 ‘transform: translate’ 偏移量不起作用,这时候需要用到 align 属性,align 属性官网没做详细链接,只是提示参考 https://github.com/r原创 2021-07-26 14:53:21 · 4279 阅读 · 1 评论 -
引入 github 中的图片无法显示
引入 github 中的图片无法显示问题描述自己维护的博客引用的都是 github 上面的图片,某一天突然发现都无法访问了。解决方案修改本机 host 文件,增加对 github的本地解析;#GitHub Start192.30.253.119 gist.github.com151.101.184.133 assets-cdn.github.com151.101.184.133 raw.githubusercontent.com151.101.184.133 gist.githubuse原创 2021-02-01 11:31:42 · 107 阅读 · 0 评论 -
修改 input,textarea disabled 颜色
修改 input,textarea disabled 颜色问题描述业务中经常有需求需要修改 input,textarea disabled 颜色。解决方案input:disabled, textarea:disabled{ opacity: 1; -webkit-text-fill-color: #222222;}原创 2021-01-17 17:58:24 · 1950 阅读 · 0 评论 -
安卓手机聚焦键盘挡住输入框
安卓手机聚焦键盘挡住输入框问题描述部分安卓手机聚焦,键盘会挡住输入框。以下是解决方案;解决方案<input class="item-input" v-model="cusTel" type="tel" @focus="focusScroll($event)" @input="limitInput($event, 'cusTel', 11)" placeholder="请输入您的手机号">// 输入框聚焦滑动focusScroll(e) { le原创 2021-01-17 17:42:23 · 239 阅读 · 0 评论 -
元素 float 不起作用
元素 float 不起作用问题描述css 设置元素 float 不起作用;解决方案影响元素 float 样式的因素会有很多,这里提两个:看元素父级有没有设置 display:flex,会使子元素的 float 失效;检查元素有没有因为需要设置超出省略而设置 display: -webkit-box; 也会使元素的 float 失效;...原创 2021-01-17 16:58:20 · 2728 阅读 · 1 评论 -
安卓机 H5 页面加粗样式没有效果
安卓机 H5 页面加粗样式没有效果问题描述部分安卓机 h5 页面 css 设置加粗没有效果;解决方案这种情况的原因是部分安卓机对 font-weigth 的兼容问题;font-weight 需要设置 700 以上,才会起作用;不要用 数字 500 和600;bold 默认 700;...原创 2021-01-17 16:17:40 · 2448 阅读 · 0 评论 -
企业微信分享出来的小程序提示找不到页面
企业微信分享出来的小程序提示找不到页面问题描述有些企业研发的内部小程序,在微信中可以正常使用,在企业微信里面分享小程序,提示:找不到页面。解决方案这个是企业微信的bug,等待修复吧,临时解决方案可以小程序页面的路径后添加 .html(小程序的路径是没有此后缀的)。...原创 2021-01-17 15:57:12 · 1886 阅读 · 2 评论 -
弹窗里面滚动穿透问题完美解决
弹窗里面滚动穿透问题完美解决问题描述在业务场景中经常会有页面有个弹窗操作,滑动弹窗滚动穿透到页面,页面在滚动,有些强迫症(难说话)的产品是不能接受的,就需要咱们研发想办法解决了。解决方案其实好多人都遇到这种问题,所以解决方案也比较多,但是那种方案是比较完美的呢。方案一:很多人第一思路是禁止滚动穿透去解决,在弹窗上面阻止滑动事件冒泡,这样的能解决弹窗文案少的场景,如果弹窗内本身需要滑动,比如:有 textarea 标签的输入需求,就会出问题了。方案二:下面代码完美解决:// css 设置 .原创 2020-05-29 15:20:15 · 2196 阅读 · 0 评论 -
小程序 ios 全面屏底部留出安全距离
小程序 ios 全面屏底部留出安全距离问题描述对于苹果手机,底部有安全距离,一些底部会有遮挡,当然可以通过过去系统信息动态设置底部距离。下面提供一个用 css 设置底部安全距离的方案解决方案苹果官方推荐使用env(),constant()来适配,建议使用该方案,不需要管数值具体是多少。这2个方法是什么呢?env()和constant(),是IOS11新增特性,Webkit的css函数...原创 2020-04-29 14:12:30 · 8654 阅读 · 0 评论 -
微信小程序设置超出行显示 ... 与展开更多按钮
微信小程序设置超出行显示 ... 与展开更多按钮问题描述业务开发中会有一些场景,超出一行显示 … 与展开更多按钮,展开更多按钮可以切换显示一行还是全部内容,少于一行正常显示;解决方案分析下问题: 一般这种需求不好实现的原因是,在移动端,每行显示的字数的有可能在不同机型会有差异,所以就使开发者无法知道这些内容是否超过一行,是否该显示展开更多按钮。绕开上述原因,曲线救国,我们在每次页面渲染完...原创 2019-04-11 22:17:06 · 17757 阅读 · 0 评论 -
ios微信小程序中 input 输入框问题,输入的光标中的内容自动清空
ios微信小程序中 input 输入框问题,输入的光标中的内容自动清空问题描述1.我在页面上有个倒计时的功能,每一秒都在更新时间,更新时间显示的值(view一直变)2.我调用input输入框,准备输入内容,每次倒计时秒数变得时候,光标的内容自动全部清空具体场景描述请见下图:解决方案这个问题是 mpvue 处理定时器和 input 输入框在ios上的兼容问题;问题连接附上:git...原创 2018-12-18 19:16:07 · 6454 阅读 · 0 评论 -
select 默认选中问题
select 默认选中问题 问题描述 select 标签会默认选中第一个 option ;但是一般使用的时候不想要默认选中第一个,而是一个空白的选择框解决方案给select元素pretend一个 option disabled = "disabled">option>;给select元素pretend一个;option stype="disp原创 2018-01-31 10:26:56 · 899 阅读 · 1 评论 -
h5 视频中的坑
h5 视频中的坑详情描述参考自此链接 以及乔的ppt; 1. 自动播放问题: 通过autoplay属性 视频的自动播放需要在video标签上添加autoplay属性, 如:\\ 但是在很多浏览器里,如 iOS 下并不支持这个属性,在 iOS下必须给webview设置 self.wView.allowsInlineMediaPlayback = YES;self.wView.med原创 2018-02-02 08:13:34 · 440 阅读 · 0 评论 -
页面唤起拨打电话
页面唤起拨打电话 详情描述window.location.href = “tel:010-59007006”;支持性比较好,ios、安卓都支持用 a 标签:a href="tel:010-59007006" class="make-call" ref="makeCall">a>;//直接点击ios、安卓都支持、但是使用自动触发安卓支持、ios支持不太好;原创 2018-02-05 08:16:28 · 1731 阅读 · 0 评论 -
推荐医生头像问题
推荐医生头像问题 问题描述 在ios9.3.2上滑动,图片会变成方形,其他手机没问题,。解决方案推荐医生医生头像,div 里面套了个 img 标签,只给 div 设置 border-radius: 50%;在 ios9.3.2 上滑动,图片会变成方形,其他手机没问题,给img也添加border-radius: 50%;原创 2018-02-05 08:25:52 · 1123 阅读 · 0 评论 -
推荐医生白色区块问题
推荐医生白色区块问题 问题描述 在 ios 上,推荐医生数据超过十条时,渲染不出来,为白色解决方案替换ul、li标签为section标签; 具体原因不明原创 2018-02-06 08:27:19 · 165 阅读 · 0 评论 -
H5 中调相机、多选等问题
H5 中调相机、多选等问题 详情描述type="file" accept="image/*" capture="camera">type="file" accept="video/*" capture="camcorder">type="file" accept="audio/*" capture="microphone">capture表示,可以捕获到系统默认的设备,比如原创 2018-02-06 08:29:04 · 919 阅读 · 0 评论 -
荣耀 10 字体显示错误,顶部部分遮掩
荣耀 10 字体显示错误,顶部部分遮掩问题描述 华为荣耀 10 机型上出现字体被显示不全,顶部被遮掩,其他大部分手机正常。解决方案给相关字体的容器设置了 padding-top:1px(1px只是意思一下);然后就恢复正常,原因不明。...原创 2018-07-11 16:23:03 · 1094 阅读 · 0 评论 -
a 标签 download 属性不起作用,或者下载的图片无法查看
a 标签 download 属性不起作用,或者下载的图片无法查看问题描述download 是 a 标签 html5 的新属性,可以点击下载文件,初次使用,经常会出现无法点击的情况,可能有以下原因,排除下:解决方案必须设置 href 属性,download 才起作用;download 属性是文件名,href 属性,指向的是要下载的文件;href 的指向需要同源,跨域下载不下来,当然...原创 2018-11-26 19:18:54 · 6636 阅读 · 0 评论 -
audio 标签自动播放不起作用或者 play() 报错
audio 标签自动播放不起作用或者 play() 报错问题描述页面的 audio 标签设置了自动播放属性,进入页面自动播放不起作用,或者用 js 控制 play(),方法无效,报错!解决方案经过各种百度,谷歌,追踪到原因如下:页面必须进行交互才能进行对 audio 播放;声音无法自动播放这个在IOS/Android上面一直是个惯例,桌面版的Safari在2017年的11版本也宣布...原创 2018-12-06 22:42:47 · 25719 阅读 · 0 评论 -
移动端的几种适配
移动端的几种适配详情描述淘宝:使用viewport缩放,通过给html添加 data-dpr=xx, 设置html字体大小,来适配移动端,唯医模仿淘宝;单位使用rem;天猫:禁止viewport缩放,定高不定宽,使用弹性盒子布局;单位使用px;京东:禁止viewport缩放,宽高都使用百分比,设置最大宽度和最小宽度;通过@media媒体查询,设置不同的宽高;单位使用px;小米:禁止原创 2018-01-31 08:24:10 · 503 阅读 · 0 评论