gpt4 book ai didi

html - CSS 菜单不适用于手机或平板电脑

转载 作者:太空宇宙 更新时间:2023-11-04 11:54:46 24 4
gpt4 key购买 nike

我创建了在这里找到的 plunkr:http://plnkr.co/edit/gqtFoQ4x2ONnn1BfRmI9?p=preview

此菜单在台式机/笔记本电脑上按预期工作。但它看起来不像在台式机上那样。

我想 CSS 是正确的,但视口(viewport)设置有问题??

HTML:

<body ng-controller="MainCtrl" ng-style="{true: {overflow: 'hidden'}, false: {}}[toggleMenu]">

<div class="header compact" role="banner">
<div class="menu" ng-class="{true: 'active', false: ' '}[toggleMenu]" ng-style="{true: {width: menuWidth}, false: {}}[toggleMenu]">
<h2 ng-click="toggleMenu = true">Menu</h2>
<div class="nav" ng-style="{ 'width' : winWidth, 'height' : winHeight }">
<ul role="navigation" class="nav-main">
<li class="active">
<a href="../makani/" data-ga-event="Header,Navigate,Home">Home</a>
</li>
<li>
<a href="../makani/challenge/" data-ga-event="Header,Navigate,The Challenge">The
Challenge</a>
</li>
</ul>
<ul role="contentinfo" class="nav-aux">
<li>
<a href="../makani/faq/" data-ga-event="Footer,Navigate,FAQ">FAQ</a>
</li>
<li>
<a href="../makani/about/" data-ga-event="Footer,Navigate,About Us">About Us</a>
</li>
</ul>
</div>
<button type="button" ng-click="toggleMenu = false">Close</button>
</div>
</div>
</body>

最佳答案

您没有在您的 CSS 中使用任何供应商前缀。即使是 iOS 8 也要求它们存在。所以除了transform还有-webkit-transform

参见 http://caniuse.com/#search=transform

顺便说一句:菜单不错。

关于html - CSS 菜单不适用于手机或平板电脑,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30343569/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com