我模拟了一个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. 2018-2019-2 《网络对抗技术》Exp4 恶意代码分析 Week6 20165311

    2018-2019 20165311 网络对抗 Exp4 恶意代码分析 2018-2019 20165311 网络对抗 Exp4 恶意代码分析 实验内容 系统运行监控(2分) 恶意软件分析(1.5分) ...

  2. stm32入门学习路线个人见解

    可以说就目前的市场需求来看,stm32在单片机领域已经拥有了绝对的地位,51什么的已经过时了也只能拿来打基础了,最后依然会转到stm32来,也正是因为这样stm32的学习者越来越多,其中不难发现绝大部 ...

  3. 在多个平台如何安装Python

    最近的一个项目,架构师米洛需要用的mqtt,服务器开发的时候,竟然用的python脚本.运行python就需要安装开发环境,好吧,百度一下就知道了大神廖雪峰.以下部分测试通过,转载记录如下. 因为Py ...

  4. linux sed 用法

    目录 Overview 命令行选项 Command-Line Options manual http://www.gnu.org/software/sed/manual/sed.html Overvi ...

  5. css3工具

    随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来 ...

  6. 软件工程第二次作业-VSTS单元测试

    一.选择开发工具 开发工具选择 Visual studio 2017 社区版,开发语言为C 由于之前已经安装完毕,所以不上传安装过程,主界面如下: 二.练习自动单元测试 使用的测试工具是VSTS,具体 ...

  7. python 数据分析算法（决策树）

    决策树基于时间的各个判断条件,由各个节点组成,类似一颗树从树的顶端,然后分支,再分支,每个节点由响的因素组成 决策树有两个阶段,构造和剪枝 构造: 构造的过程就是选择什么属性作为节点构造,通常有三种节 ...

  8. DateTimeFormat

    中文:星期一,星期二 System.Globalization.CultureInfo.CurrentCulture.DateTimeFormat.GetDayName(DateTime.Now.Da ...

  9. CentOS系统/tmp目录里面的文件默认保留多久

    一.CentOS系统/tmp目录里面的文件默认保留多久 CentOS6默认保留30天,CentOS7默认保留10天 一.CentOS7系统/tmp目录里面的文件默认保留多久 CentOS7默认保留10 ...

  10. 利用AMPScript获取Uber用户数据的访问权限

    现代项目开发和资产管理方法正在不停地快速变化.在这场创新和扩张的竞赛中,新资产被迅速部署并暴露于公共互联网,已有资产也在不断发展. 要跟上这个不断变化的攻击面是很难的,更不用说保护这些应用程序和系统了 ...