当网页稳定菜单仅在移动设备上但菜单不显示或隐藏时,如何修复菜单
<div class="container">
<a class="logo" href="<?php echo site_url();?>"><img src="<?php echo base_url().'theme/images/'.$data['site_logo_header'];?>" alt="<?php echo $data['site_name'];?>"></a>
<a class="right-area src-btn" href="#" >
<i class="active src-icn ion-search"></i>
<i class="close-icn ion-close"></i>
</a>
<div class="src-form">
<form method="get" action="<?php echo site_url('search');?>">
<input type="text" name="search_query" placeholder="Search here" required>
<button type="submit"><i class="ion-search"></i></a></button>
</form>
</div><!-- src-form -->
<a class="menu-nav-icon" data-menu="#main-menu" href="#"><i class="ion-navicon"></i></a>
<div class="nav-wrapper large-nav">
<ul class="main-menu" id="main-menu">
<li><a href="<?php echo site_url();?>">HOME</a></li>
<li>
<a href="<?php echo base_url();?>profile" class="menu-down">
PROFILE
</a>
<div class="menu-down">
<a class="dropdown-item" href="#">SEJARAH</a>
<a class="dropdown-item" href="#">LAMBANG</a>
<a class="dropdown-item" href="#">DANSAT</a>
<a class="dropdown-item" href="#">PEJABAT TERAS</a>
<a class="dropdown-item" href="#">RIWAYAT PENUGASAN</a>
<a class="dropdown-item" href="#">TUGAS POKOK</a>
</div>
</li>
<!--<?php
$query=$this->db->get('tbl_category', 3);
foreach ($query->result() as $row):
?>
<li><a href="<?php echo site_url('category/'.$row->category_slug);?>"><?php echo strtoupper($row->category_name);?></a></li>
<?php endforeach;?>-->
<li><a href="<?php echo site_url('blog');?>">BLOG</a></li>
<li><a href="<?php echo site_url('contact');?>">CONTACT</a></li>
</ul>
</div>
<div class="clearfix"></div>
</div><!-- container -->
帮我解决这个CSS吗?我很累要解决这个菜单。请任何人帮助我尝试并指导我
答案 0 :(得分:0)
我不知道您是否接受不同的建议,我的菜单始终像这样,如果媒体屏幕宽度大于1024,而没有显示,则桌面宽菜单类desktopmenu仅显示块。然后有一个用于移动设备的第二菜单mobilemenu类,其中包含下拉菜单和burger图标切换,可触发1024以下的显示块并隐藏1024以上的媒体屏幕宽度。希望能帮助到你。我会去研究您的代码,但是我正在使用移动设备。不能输入代码atm。如果您仍然希望保留该格式,请明天查看。希望我的建议能对您有所帮助,以防万一您想改变您的做法。如果您不想菜单,则可以始终使用网格CSS或Flex。我认为只是网格,我需要一些-ms-前缀的双码敌人,即ie9和safari。从图像看来,您似乎缺少仅@media移动@屏幕最大宽度768px css格式。乌尔喜欢中途艰难。