使用媒体查询在屏幕宽度改变的时候实时更改样式

 媒体查询需要一层层查找下去修改，否则无效

当屏幕宽度小于1024的时候，.time-box里头的.data内容被隐藏

       <li class="time-box">
            <div class="time">{{systemTime}}</div>
            <div class="date">
                <div>{{systemWeek}}</div>
                <div>{{systemDate}}</div>
            </div>
        </li>

@media only screen and (max-width: 1024px){

.time-box{

>div.date {

display: none;

}

}

}