优雅的响应式

/ 93评 / 1

响应式主题给我的感觉真是遥不可及,那些主题很有质感,一看就是高级料,我还真认为我做不来,,就算弄出来也要费很大力气,没想到。。。今天查了下资料,再理解理解,就折腾出来了。貌似很简单的说

好吧,其实很早就想学这东西了,不过一直没动手查相关资料,这两天和Ashe聊天的时候,谈到了D7这个主题,然后自然就谈到了自适应,唉,Ashe对我期望还是蛮大的,他想让我也学学这玩意儿,好吧,既然我被包养了,当然不能只吃不干,我也努力有求必应,能力范围内的努力做到,让我学习自适应这东西,和我本身又没啥冲突,而且我也打算学习下,所以当然满口答应咯

好吧,说正事,关于响应式,百度百科的答案是这样的:

这东西对我没丝毫价值诶,想要学习,还是要靠自己。。。于是无节操的下载了几个响应式模板。。。

前后找了找,我以为是js控制的响应式,后来把js都删除了,发现还是能自适应,于是果断查看css。。。发现了诡异的东西::::::

重点来啦

@media handheld and (max-width:950px), screen and (max-device-width:950px), screen and (max-width:950px) {
这里是响应式的css
}

好吧,结合强大的网络资源,我了解到、、、黄色部分意思是当浏览器宽度小于950px,执行绿色部分的css

好吧,竟然如此简单,用到的是Css3。。。没节操啊

如果你也想给主题弄成响应式的,那就动手吧,,,结合自己的大脑,ComeOn

我是果断给主题弄了下,,,目前还只有小于950px的效果,,后期慢慢再加几个

另外如果想看我博客不想有广告的话。。。那就把浏览器缩小一下,,,清新无广告就出来啦

 

  1. 刘荣焕说道:

    话说手机模式下左边的小侧边栏挡住文字了

  2. 馒头饭madfan说道:

    试验了一下,还真是这样咦

  3. John Shine说道:

    勤奋好学啊

    • Tokin说道:

      @John Shine 我现在这个主题样式差不多了,不过还需要调试,所以把这个响应式功能给去掉了

  4. ye,夜说道:

    一个小小问题,ie下提交有点毛病

  5. ye,夜说道:

    🙁 🙁 你的心情说怎么实现啊? :mrgreen:

  6. 斌果说道:

    颇有发叔的风范呀 😳 😳

  7. 单车岁月说道:

    back2top已偷走 :mrgreen:

  8. 天域剑客说道:

    浅城你的MC线路抽风了? ➡ ➡

  9. 我的博客的布局有很大的问题。

  10. 王仁龙说道:

    😳 向博主学习!!!

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注