如何制作div及其文字不显示在手机上？

Question

我有一个div（圆圈）和文字，我只想在桌面上显示。

<div class="circle">Text Here</div> 

我可以隐藏精用这个圈子：

@media screen and (min-width: 600px) { 
.circle{ 
//Circle design 
} 
} 

然而，专区内的“文本这里仍显示。

任何人都知道如何隐藏文字吗？

谢谢！

Answer 1

为了达到预期的结果，请使用以下

CSS: 
.circle{ 
display:none; 
} 

@media screen and (min-width: 600px){ 
.circle{ 
display:block; 
} 

}

选项2： CSS

 .circle{ 
    visibility:hidden; 
    } 

    @media screen and (min-width: 600px){ 
    .circle{ 
    visibility:visible; 
    } 
} 

选项3：

@media screen and (max-width: 600px){ 
    .circle{ 
    display:none; 
    } 
} 

codepe ñ网址以供参考 - https://codepen.io/nagasai/pen/JNXypz

Answer 2

如果浏览器窗口小于600px的小，显示元素与class="circle"

.circle { 
 
    display: none; 
 
} 
 

 
@media screen and (max-width: 600px) { 
 
    .circle { 
 
    display: block; 
 
    } 
 
}

<div class="circle">Text Here</div>

Answer 3

只需在您的媒体查询添加display:none;。

@media screen and (max-width: 600px) { 
    .circle { 
     display:none; 
    } 
} 

现在它显示为一个块，但现在它会显示为无，当它达到600px宽。