利用css判断窗口的大小，来显示或隐藏css特效。

比如想让某个css特效只在手机端显示或者只在电脑端显示。

就像我的博客现在的两个灯笼，我只想让它在电脑端显示，不让它在手机端显示，那么该怎么办呢！

其实很简单，我们只需要给css特效加个判断就能现实了，看下面的代码！！！（注：我这里以我博客的灯笼css为例，但是对于其他css特效的原理其实是相通的！！！

灯笼css代码地址：css挂灯笼）

只在电脑端显示：

<div class="deng-box">/*这是第一个灯笼*/
<div class="deng-box1">/*这是第二个灯笼*/
<style>
.deng-box,.deng-box1{display: none;}/*选择class的属性值*/
@media (min-width: 678px){.deng-box,.deng-box1{display:inline;}}/*显示器低于我们定义的尺寸，我们判断为移动端*/
</style>
/*判断为手机用户不显示*/

只在手机端显示：

<div class="deng-box">/*这是第一个灯笼*/
<div class="deng-box1">/*这是第二个灯笼*/
<style>
.deng-box,.deng-box1{display: inline;}/*选择class的属性值*/ @media (min-width: 1200px){.deng-box,.deng-box1{display:none;}}
</style>

代码简单明了，使用方法应该都明白了吧！

比如我，不想让灯笼在移动端显示，我就把下面的代码添加到灯笼css的</style>的前面。

这样移动端就不会显示了。