随笔分类 -  前端 / 适配问题

随手记录遇到的适配问题。不一定有解决方案。
[适配]根据用户浏览器设置适配页面明暗
摘要：prefers-color-scheme - CSS: Cascading Style Sheets | MDN (mozilla.org) Window: matchMedia() method - Web APIs | MDN (mozilla.org) 阅读全文
posted @ 2024-02-26 11:53 夕苜19 阅读(6) 评论(0) 推荐(0) 编辑
[适配]关于弹窗div设置position:fixed不生效的问题
摘要：①重复设置position属性。② 父元素带有transform属性。 阅读全文
posted @ 2023-03-16 15:52 夕苜19 阅读(177) 评论(0) 推荐(0) 编辑
[CSS]背景图片很大，根据屏幕缩小适配后，div之间有空隙的问题
摘要：暂时的解决方案是给这些有空隙的div都加上 margin-top: -2px; 期待更优解。 阅读全文
posted @ 2023-01-19 13:47 夕苜19 阅读(202) 评论(0) 推荐(0) 编辑
[适配]关于页面适配的整理
摘要：先进行分类。有空填坑。 1.pc或h5长页面，根据浏览器宽度适配。 考虑：fixed属性的页面头部、弹窗，可能需要才用.container .top .pup 三部分分别进行适配。 (function() { function fit_block() { var clientw = document 阅读全文
posted @ 2023-01-18 15:32 夕苜19 阅读(38) 评论(0) 推荐(0) 编辑
[BOM]判断是否为pc页面、是否为ios页面、是否为微信页面
摘要：常用于pc页面与h5页面的跳转和适配 阅读全文
posted @ 2023-01-10 20:57 夕苜19 阅读(50) 评论(0) 推荐(0) 编辑
[适配]单屏页面整体居中适配后，横竖屏切换的问题
摘要：场景： ① 页面内容在一个屏幕内展示完，不上下左右滑动。 ② 页面内容左右居中/上下居中。 ③ 页面原本内容为竖屏，需要在横屏浏览器中强制左旋90°。 阅读全文
posted @ 2022-09-16 15:49 夕苜19 阅读(51) 评论(0) 推荐(0) 编辑
[适配]页面有放缩的情况下，UC浏览器中input框的width比实际设置小的问题
摘要：初步推测UC浏览器给input、textarea元素设置了max-width为屏幕宽度。 阅读全文
posted @ 2022-08-18 09:31 夕苜19 阅读(106) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示