Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

CSS.supports css var特性检测的返回异常 #570

Open
qqworker opened this issue Apr 21, 2023 · 0 comments
Open

CSS.supports css var特性检测的返回异常 #570

qqworker opened this issue Apr 21, 2023 · 0 comments

Comments

@qqworker
Copy link

qqworker commented Apr 21, 2023 •
edited

测试html的代码如下：
test.html

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>CSS特性测试页面</title>
    <style>
        .container {
            width: 60%;
            margin: 10% auto 0;
            background-color: #f0f0f0;
            padding: 2% 5%;
            border-radius: 10px
        }

        ul {
            padding-left: 20px;
        }

        ul li {
            line-height: 2.3
        }
    </style>
    <script>
        function canUse(t) {
            return window.CSS && CSS.supports && (CSS.supports(t) || CSS.supports.apply(CSS, t.split(":")));
        }
    </script>
</head>
<body>
    <div class="container">
        <h1>这个是一个测试css是否支持var/env/constant的页面</h1>
        <ul>
            <li><script>document.write('css.body.display.flex:' + (canUse('display:flex') ? '支持': '不支持'));</script></li>
            <li><script>document.write('css.var:' + (canUse('--a:0') ? '支持': '不支持'));</script></li>
            <li><script>document.write('css.env:' + (canUse('top:env(a)') ? '支持': '不支持'))</script></li>
            <li><script>document.write('css.constant:' + (canUse('top:constant(a)') ? '支持': '不支持'))</script></li>
        </ul>
    </div>
</body>
</html>

在普通的浏览器显示是
image
但是在Miniblink下显示是
image

目前造成的后果是uniapp框架的leftwindow都不能正常的显示了。
例如：
https://hellouniapp.dcloud.net.cn/
http://hellouniadmin.dcloud.net.cn/admin/
都无法正常显示。
目前只能把生成uniapp的代码中查找
this.topWindow||this.leftWindow||this.rightWindow)&&uni.canIUse("css.var")&&window.matchMedia&&(
将&&uni.canIUse("css.var")删除，不然左边栏都无法显示。
由于uniapp的受众群体很大，建议修复这个问题。
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@qqworker