在index.html中

<style>
@media all and (min-width: 0px) {
html{font-size: 20px;}/* 12*4.6 */
}
@media all and (min-width: 640px) {
html{font-size: 50px;}/* 14*4.6 */
}
@media all and (min-width: 768px) {
html{font-size: 53px;}/* 16*4.2 */
}
@media all and (min-width: 800px) {
html{font-size: 53px;}/* 16*4.2 */
}
@media all and (min-width: 1024px) {
html{font-size: 65px;}/* 18 *4.6*/
}
@media all and (min-width: 1100px) {
html{font-size: 65px;}/* 20 *4.6 */
}
@media all and (min-width: 1280px) {
html{font-size: 82px;}/* 22 *3.03*/
}
@media all and (min-width: 1366px) {
html{font-size: 83px;}/* 24 */
}
@media all and (min-width: 1440px) {
html{font-size: 83px;}/* 25 */
}
@media all and (min-width: 1680px) {
html{font-size: 87px;/* 28 */
}
@media all and (min-width: 1920px) {
html{font-size:100px;}/* 33 */
}
</style>

vue中 用媒体查询 空置根节点字体大小的更多相关文章

  1. 彻底弄懂设置根元素字体大小calc(100vw/18.75) 实现rem自适应

    rem 是相对文档根元素(html)字体大小的尺寸单位,当元素的尺寸或文字字号等使用 rem 单位时,会随着根元素的 font-size 变化而变化,那么在不同分辨率的设备下动态设置根元素的字体大小就 ...

  2. Bulma 中的媒体查询

    在 Bulma 中将设备分为 6 类:手机.平板.触屏设备.桌面.宽屏和大屏.提供了四个阈值. // sass/utilities/variables.sass $tablet: 769px !def ...

  3. vue中element-ui树形控件自定义节点,注意一下

    在项目中用到菜单项编辑删除,在 element-ui自定义节点内容时, 有说明:使用render-content指定渲染函数, 得环境支持 JSX 语法,只要正确地配置了相关依赖,就可以正常运行. 一 ...

  4. js媒体查询设置根字号

    !function(n){var e=n.document,t=e.documentElement,i=750,d=i/50,o="orientationchange"in n?& ...

  5. 在javascript中使用媒体查询media query

    由于需要,我们可能会在js中用到一些media query,从而针对不同的分辨率做一些操作. //全兼容的 事件绑定 and 阻止默认事件 var EventUtil = { //Notice: ty ...

  6. vue中如何让多个echarts随屏幕大小变化

    在vue项目中使用Echarts  一般window.onsize在页面中只能存在一个. 如何在一个页面中多个echarts使用window.onresize?    myChart 可以放在Data ...

  7. eclipse中android开发怎么修改xml文件字体大小

    windows->preference->General->appearence->Colors and Font->Basic->Text Font.点击右侧的E ...

  8. bootstrap媒体查询

    Bootstrap 中的媒体查询允许您基于视口大小移动.显示并隐藏内容.下面的媒体查询在 LESS 文件中使用,用来创建 Bootstrap 网格系统中的关键的分界点阈值. /* 超小设备(手机,小于 ...

  9. Bootstrap 网格系统(Grid System)的工作原理 - 媒体查询

    媒体查询 媒体查询是非常别致的"有条件的 CSS 规则".它只适用于一些基于某些规定条件的 CSS.如果满足那些条件,则应用相应的样式. Bootstrap 中的媒体查询允许您基于 ...

随机推荐

  1. FTP匿名访问修复方法

    window2003 window2008

  2. Linux CentOS6.5上搭建环境遇到的问题

    1.卸载CentOS自带的JDK 查看centos上 安装的jdk:rpm -qa|grep jdk 出现如下: java-1.7.0-openjdk-1.7.0.45-2.4.3.3.el6.x86 ...

  3. [转]JAVA并发编程学习笔记之Unsafe类

    1.通过Unsafe类可以分配内存,可以释放内存:类中提供的3个本地方法allocateMemory.reallocateMemory.freeMemory分别用于分配内存,扩充内存和释放内存,与C语 ...

  4. SaltStack 批量管理任务计划

    这里演示如何使用 salt-master 对多台 salt-minion 批量添加任务计划,步骤如下: [root@localhost ~]$ cat /srv/salt/top.sls # 先定义入 ...

  5. php-fpm 配置进程池

    什么是 php-fpm :php 是作为一个独立服务存在的,这个服务叫做 php-fpm什么是 php-fpm pool :也就是 php-fpm 的进程池,这个进程池中运行了多个子进程,用来并发处理 ...

  6. Unity读取配置文件

    config.ini存放在Assets目录下,项目打包之后存放在Data目录下exe同目录 // 从配置文件读取 string configFile = Application.dataPath + ...

  7. NUC972配置为支持NFS

    系统平台:virtualbox3.2.10+ubuntu10.10 安装nfs: #sudo apt-get install nfs-kernel-server ubuntu10.10中的已经是最新版 ...

  8. React Native(七)——react-native-elements

    配合React native使用的UI库:https://react-native-training.github.io/react-native-elements/ 1. 新建项目:http://w ...

  9. LOCAL_WHOLE_STATIC_LIBRARIES与LOCAL_STATIC_LIBRARIES的区别

    在分析Jelly Bean Audio Subsystem的时候,发现HAL层的库audio_policy.xxx.so与其依赖的静态库libaudiopolicy_legacy.a都有audio_p ...

  10. 【PHP】常见算法

    1 冒泡排序 思路:在要排序的一组数中,对当前还未排好的序列,从前往后对相邻的两个数依次进行比较和调整,让较大的数往下沉,较小的往上冒. 即,每当两相邻的数比较后发现它们的排序与排序要求相反时,就将它 ...