如何隱藏桌面上的按鈕

Question

我在我的網站上有一個按鈕，但我希​​望它只能在手機上使用。 如何將其從我的桌面網站隱藏？

<div class="pull-right"> 
    <button class="button-menu-mobile open-left"> 
     <i class="ion-navicon"></i> 
    </button> 
    <span class="clearfix"></span> 
</div> 

這裏是CSS

.button-menu-mobile { 
background: transparent; 
border: none; 
color: #ffffff; 
font-size: 21px; 
line-height: 60px; 
padding: 0px 15px; 

謝謝:)

Answer 1

我附上一個工作代碼段，在這裏，如果你去全屏幕，你將無法看到按鈕。

工作實例

@media(min-width: 900px) 
 
    { 
 
    .button-menu-mobile 
 
    { 
 
    display:none; 
 
    } 
 
    }

<div class="pull-right"> 
 
    <button class="button-menu-mobile open-left"> 
 
     <i class="ion-navicon"></i> 
 
    </button> 
 
    <span class="clearfix"></span> 
 
</div>

您需要使用媒體查詢用於這一目的。根據您的需要設置最小寬度。

@media(min-width: 900px) 
{ 
.button-menu-mobile 
{ 
display:none; 
} 
} 

Answer 2

代碼：

@media screen and (min-width: 600px) { 
 
    .pull-right { 
 
     visibility: hidden; 
 
    } 
 
}