移动端如何定义字体font-family

移动端如何定义字体font-family
中文字体使用系统默认即可,英文用Helvetica

/* 移动端定义字体的代码 */
body{font-family:Helvetica;}
参考《移动端使用字体的思考》

移动端字体单位font-size选择px还是rem
对于只需要适配手机设备,使用px即可

对于需要适配各种移动设备,使用rem,例如只需要适配iPhone和iPad等分辨率差别比较挺大的设备

rem配置参考:

复制代码
html {font-size:10px}

@media screen and (min-width:480px) and (max-width:639px) {
html {
font-size: 15px
}
}

@media screen and (min-width:640px) and (max-width:719px) {
html {
font-size: 20px
}
}

@media screen and (min-width:720px) and (max-width:749px) {
html {
font-size: 22.5px
}
}

@media screen and (min-width:750px) and (max-width:799px) {
html {
font-size: 23.5px
}
}

@media screen and (min-width:800px) and (max-width:959px) {
html {
font-size: 25px
}
}

@media screen and (min-width:960px) and (max-width:1079px) {
html {
font-size: 30px
}
}

@media screen and (min-width:1080px) {
html {
font-size: 32px
}
}

Did you like this article? Share it with your friends!

时间: 2024-10-07 07:24:41

移动端如何定义字体font-family的相关文章

iOS使用自己定义字体

1.加入相应的字体(.ttf或.odf)到project的resurce,比如my.ttf. 2.在info.plist中加入一项 Fonts provided by application (item0相应的value为my.ttf,加入多个字体依次加入就能够了). 3.使用时aLabel.font=[UIFontfontWithName:@"XXX" size:30]; 注意XXX不一定是my,这里是RETURN TO CASTLE. 能够用例如以下方法查看familyname和f

【BO】为WEBI报表添加自定义字体font

本篇主要讲解如何为sap business objects 的web intelligence报表组件新增字体.因为系统默认预设的字体对中文而言实在是太丑了,有的字体特喵的直接把中文变成方框框了! 一.系统环境: SAP BusinessObjects Business Intelligence (BI) 4.x Windows Server2008R2 示例字体:微软雅黑 二.操作步骤 1.首先要确保[微软雅黑]字体已经安装在Windows系统里了(“安装”指的是:ttf文件存放在这个目录下:

CSS属性之字体(Font)

CSS属性之字体(Font) font:[ [ <font-style> || <font-variant> || <font-weight> ]? <font-size> [ / <line-height> ]? <font-family> ]  复合属性,各属性见下文. 必须同时包含font-size和font-family,且这两个值顺序不能变,其他关键字的值放到这两个值的前面,顺序可以随意打乱. 可以在字号值(font-siz

CSS定义字体间距 字体行与行间距

CSS定义字体行间距 line-height:xxpx; CSS定义字体间距 下面我们讲述一下CSS的文本属性,还是先来看一下文本属性的详细列表: 属性 属性含义 属性值 Word-spacing 定义了各个单词之间的间距 Normal<length>必须以长度为单位 Letter-spacing    定义了每个字母之间的间距 同上 Text-decoration 定义文字的"装饰"样式 None|underline|overline| line-through|blin

Android 解决TextVIew载入自己定义字体慢的问题

网上非常多自己定义字体样式的代码.都是告诉应该这样做: 在自己定义控件里写,可是这样写有问题,会随着界面里自己定义控件越多.Activity载入速度越慢,太多了easy造成内存泄露问题,由于你没创建一个自己定义控件,Typeface都会创建一次 我的样例会造成延迟时间 正确的方式应该在Application中设置成静态变量 在自己定义空间中: 这样引用 字体文件路径: 这样仅仅创建一次.会剩非常多时间 代码非常easy.希望大家以后多多支持.对于刚入行的新手非常有帮助.

(转)CSS定义字体间距 字体行与行间距

源网址:http://www.cnblogs.com/jian1982/archive/2010/07/03/1770349.html CSS定义字体行间距 line-height:xxpx; CSS定义字体间距 下面我们讲述一下CSS的文本属性,还是先来看一下文本属性的详细列表: 属性 属性含义 属性值 Word-spacing 定义了各个单词之间的间距 Normal<length>必须以长度为单位 Letter-spacing 定义了每个字母之间的间距 同上 Text-decoration

Android Studio 3.1.2 修改字体(font)大小(size) 及老版本修改主题、字体、颜色 参照地址

Android Studio 3.1.2  修改字体(font)大小(size) 步骤:File-Settings-Editor-Color Scheme-Color Scheme Font-Size 图片:         老版本as修改主题.字体.颜色 参照地址: https://blog.csdn.net/bangyiqing/article/details/52241746 原文地址:https://www.cnblogs.com/1502720115chenzhen/p/9063176

[ASP NET MVC] 使用ReportViewer执行用户端报表定义文件(.rdlc)产出报表

使用ReportViewer执行用户端报表定义文件(.rdlc)来产出报表 前言 以往使用ASP.NET WebForm进行网站开发时,笔者面对报表的产出多会使用ReportViewer来进行,并且搭配用户端报表定义文件(.rdlc)来设计报表外观,其实是相当灵活的解决方案:如今使用ASP.NET MVC进行开发,虽然View中无法加入任何WebForm Control了,但我们依旧可以建立一个共用WebForm页面,在此页面上加入熟悉的ReportViewer来协助产出报表.详细实践细节请参考

关于移动端APP开发-字体样式变大问题

前两天在写App项目的时候发现一个问题,就是明明css写的样式是14px,刚开始在页面显示时并未出现问题,可是内容一多,字体突然变大了. what?,不明所以,在各大网站上找了好久才知道是浏览器的字体提升的问题. 先说说解决的方法吧,可以直接在css样式中写下 body,body*{ Max-height:1000000px; } 就可以直接禁用. 出现这一原因可能是和font boosting有关.font boosting 特性在这时会自动将其中的文字字体变大,保证在即不需要左右滑动屏幕,也