我模拟了一个QQ音乐的radiostation页面，用了媒体查询以及流式布局，页面大部分内容是js根据json生成的，使用了less来编写css样式表。

下面是仓库地址，感兴趣的小伙伴可以打开看看，将浏览器横向伸缩成不同大小可以看到页面适配效果。

https://yummylucky.github.io/qqMusicRadioStation/radioStation.html#modleTitle_5

页面适配的小栗子 - github的更多相关文章

  1. 教你如何用 lib-flexible 实现移动端H5页面适配

    前话 好久没写教程了(可能会误导新手的菜鸟教程(￣▽￣)"). 这是我的github,欢迎前端大大们和我一起学习交流 https://github.com/pwcong 最近入职公司做前端实 ...

  2. 【Puppeteer】puppeteer安装/常用的方法以及一个小栗子(Youtube油管自动评论)

    这里介绍的是Win平台的安装方法,其他平台请至Github>Puppeteer. 首先要安装node.js 可以看我这篇的开头>[Angular]学习笔记-环境部署.项目建立相关 1.新建 ...

  3. 【原】让H5页面适配移动设备全家 - 设计师篇 - PPT

    上一篇文章<pageResponse - 让H5适配移动设备全家>中分享了一个小插件让一套H5页面适配几乎所有移动设备,得到了一些同学的推荐和认可,这里感谢大家的支持. 在此之前也在部门前 ...

  4. cookie小栗子-实现简单的身份验证

    关于Cookie Cookie是一种能够让网站Web服务器把少量数据储存到客户端的硬盘或内存里,或是从客户端的硬盘里读取数据的一种技术. 用来保存客户浏览器请求服务器页面的请求信息,可以在HTTP返回 ...

  5. h5页面适配小结

    大概是去年的7月想写这个内容去加深自己的理解.现在终于回来补上这篇入门小结了. 1.问题描述 适配的目标:在不同尺寸的手机设备上,页面“相对性的达到合理的展示(自适应)”或者“保持统一效果的等比缩放( ...

  6. SpringBoot+Shiro+Redis共享Session入门小栗子

    在单机版的Springboot+Shiro的基础上,这次实现共享Session. 这里没有自己写RedisManager.SessionDAO.用的 crazycake 写的开源插件 pom.xml ...

  7. SpringBoot+Shiro入门小栗子

    写一个不花里胡哨的纯粹的Springboot+Shiro的入门小栗子 效果如图: 首页:有登录注册 先注册一个,然后登陆 登录,成功自动跳转到home页 home页:通过认证之后才可以进 代码部分: ...

  8. Particle 粒子效果使用(适配微信小游戏，particle is not defined)

    在微信小游戏中使用粒子效果 参考: 1. 粒子库下载地址 2. 粒子官方使用教程 3. 水友解决微信小游戏particle is not defined 一.下载第三方库 Git地址:https:// ...

  9. java网络爬虫爬虫小栗子

    简要介绍: 使用java开发的爬虫小栗子,存储到由zookeeper协调的hbase中 主要过程是模拟Post请求和get请求,html解析,hbase存储 源码:https://github.com ...

随机推荐

  1. 利用GCD 中的 dispatch_source_timer 给tableViewCell添加动态刷新的计时/倒计时功能

    1.思路一(失败) 在设置好cell 里的内容之后在每个cell 返回时调用定时器事件,更新cell 内容,然后刷新整个表格. - (void)didadida:(UITableViewCell *) ...

  2. linux自定义开机自启多个服务的脚本

    linux服务器重启后,每次要启动redis.ftp.tomcat等应用总是很麻烦,于是写了一个自定义脚本,在开机或重启的时候,自动启动多个服务.应用. 很简单,写脚本.设置开机启动.   第一步.准 ...

  3. python pip出错问题解决记录

    今天安装一下requests模块,遇到网络问题 pip install requests Retrying (Retry(total=4, connect=None, read=None, redir ...

  4. hdfs核心主件服务的启停方式

    停止mapreduce服务 /hadoop/hadoop-2.6.4/sbin/stop-yarn.sh 启动mapreduce服务 /hadoop/hadoop-2.6.4/sbin/start-y ...

  5. callback function(回调函数) - 术语

    回调函数(CallBack Function)的定义: [todo] 下面是callback的一个场景,linux内核.LwIP里也有使用callback funcs.

  6. Visual Studio 2017的一些使用记录

    只要在整个项目组里加一个新的项目,vs就会去自动修改sln文件 新加一个项目的理解为:菜单里 File->New->Project一个项目编译后生成1个dll文件 sln是文本文件只有vs ...

  7. 如何查看正在执行sql的语句及其父语句调用？如何查看正在执行SQL的具体参数值与执行计划？

    ---SQL Server查询正在执行的SQL语句及执行计划 select ds.session_id,dr.start_time,db_name(dr.database_id),dr.blockin ...

  8. TCP/IP ARP

    ARP(Address Resolution Protocol)地址解析协议,是根据IP地址获取物理地址的一个TCP/IP协议. 当在同一网络段内或同一子网内,主机发送信息时将包含目标IP地址的ARP ...

  9. jupyter notebook 动态图显示

    直接在import matplotlib.pyplot as plt 后面加%matplotlib,或者%matplotlib auto就可以通过弹出窗口的形式显示图片

  10. OO第二单元总结(多线程的电梯调度)

    经过第一单元作业的训练,在做第二单元的作业的时候,要更加的有条理.但是第二次作业多线程的运行,带来了更多的运行的不确定性.呈现出来就是程序会出现由于线程安全问题带来的不可复现的bug.本单元的作业也让 ...