CSS字体大小设置时的参考(转)
from:http://blog.sina.com.cn/s/blog_51cd580b0100gg6y.html
font-size 设置的绝对关键字:
以下几个绝对字体大小的设置是有效的。当然他们是浏览器预定义设置的。给元素指定了绝对关键字font-size的时候,该元素就不会继承父元素的字体大小
- font-size: xx-small;
- font-size: x-small;
- font-size: small;
- font-size: medium;
- font-size: large;
- font-size: x-large;
- font-size: xx-large;
尽管大多数的浏览器支持上面的关键字,但是他们的精确的大小是不相同滴。
font-size的绝对大小:
fone-size能被设置成下面得绝对大小:
- mm: 毫米,例如:10mm.
- cm: 厘米 ,例如:1cm ( = 10mm).
- in: 英寸(inch),例如 : 0.39in ( ~= 10mm).
- pt: point(点), 1pt 相当于 1/72 英寸, 例如: 12pt.
- pc: pica(十二点活字), 1pc 是 12pt
- px: pixel(像素), 例如: 14px.
一般说来上面得这些度量单位都有些问题
比如:毫米,厘米,英寸是对于不同媒体介质是不精确地,由于分辨率的设置不同,pt和pc就是相对不可靠地。pix来起来是最合适的,但是它能导致一些辅助性问题:IE下不能重新调整字体的大小。
相对大小:font-size属性能被设置成相对于父节点的字体大小的相对大小。
- em: 1em相当于当前字体的1倍大小的字体。2em相当于当前字体的2倍字体大小的字体。
- %: 100%相当于当前字体大小, 200% 相当于2倍字体的大小.
- ex: 1ex 相当于当前字体中字母 ‘x’高度值一样大小的字体.
很少的开发者使用ex ,实际上某些情况下ex还是相当好用的,比如当你需要更精确的字体的大小的时候,1ex要比0.525em更好,更精确。
%和em的值是等价的,比如:50% = 0.5em, 100% = 1em, 120% = 1.2em等等,
尽管会有很少的一些浏览器有些微妙的差别,但是毕竟那是很少见的问题。如果你想要保存更小的字节,就需要用更短的名字去定义font-size的值。比如:50%要比0.5em占用字节少,1em要比100%占用的字节少。
文本字体的大小和页面放缩。
这是附加复杂深入部分,大多数浏览器允许用户在浏览器中做如下操作:
1.增加或减少基本字体大小(图片除外)
2.页面放缩是所有的文字和图片也相应发生放缩变化。
3.不但允许字体放缩,而且还允许页面放缩
备注(深入理解):在ie中如果页面中的元素的字体被用px(像素)赋值了,那么该元素的字体在页面放缩的时候不会发生变化。
如果您是有印刷行业背景的设计师将要转移到web设计,那就建议您不要给予用户过多的权利否则他们会打乱您的设计作品。您的设计作品被放大到200%的时候,或者字体减少至50%,就会被破坏掉。
css font-size 设置建议(规范)
一般来说,大多数情况下使用em或者%,这样字体就能被浏览器用更精细比例的字体支持。我个人建议使用百分比%来定义font-size大小,这种做法在一些老的浏览器中支持的也会更好。
当你在开发一个网站的时候有下面的一组建议提供给您:
1. 在testing之前,重置所有浏览器的字体的大小。
2.尽量合理的定义字体的大小,以便于在页面放缩的时候页面仍然保持良好的可读性。
CSS字体大小设置时的参考(转)的更多相关文章
- Chrome浏览器下CSS字体大小设置小于12px无效问题
当字体大小被设置小于12px时,IE.firefox可以起作用.但chrome中仍然显示为12px大小. 解决方法为: html, body { -webkit-text-size-adjus ...
- css字体大小设置em与rem的区别
em 单位em是相对于父元素的,如果父元素没有设置字体大小,那就会追溯到body. 比如 如果我在box_text的父元素box加了一个字体大小 那么body的8px就会被box_text的父元 ...
- eclipse护眼颜色和字体大小设置
♣eclipse护眼颜色和关键字颜色设置 ♣eclipse字体大小设置(包括jsp , .xml ,.java) 1.Eclipse字体大小调整: 窗口(Window)-首选项(Preferences ...
- eclipse中的字体大小设置和背景色设置
1.字体大小设置 在basic下选择最后一个TextFont 护眼背景色设置 添加到自定义颜色后点确定 最后一步点apply
- css 字体样式设置
css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人 css字体样式(Font Style) ...
- (转)CSS字体大小: em与px、pt、百分比之间的对比
CSS样式最混乱的一个方面是应用程序中文本扩展的font-size属性.在CSS中,你可以用四个不同的单位度量来显示在web浏览器中的文本 大小.这四个单位哪一种最适合Web? 这个问题引起了广泛的争 ...
- html5移动端页面分辨率设置及相应字体大小设置的靠谱使用方式
对于html5移动端网页编写CSS网上有很多介绍的文章,但在实际使用过程中还是会纠结. 网上的资料太多,且大多都是技术介绍型,特别是针对android上,网上写的各种麻烦,各种复杂,各种不接地气儿.. ...
- phpMyAdmin 个性化设置,字体大小设置,去掉“以树形显示数据库”,禁用“发送错误报告”
个性化设置phpMyAdmin 在使用phpMyAdmin 3.5.8.2时,发现: 如果数据库有相同的前缀,左边数据库导航会把前缀合并,即所谓的“以树形显示数据库”,真的有点不习惯,如下图所示: 不 ...
- CSS——字体大小最常用的单位
px (像素): 将像素的值赋予给你的文本.这是一个绝对单位, 它导致了在任何情况下,页面上的文本所计算出来的像素值都是一样的. ems: 1em 等于我们设计的当前元素的父元素上设置的字体大小 (更 ...
随机推荐
- Beginning Android 4 Programming Book学习
Chapter 3 EditText不自动获取焦点,自动获取焦点但不显示软键盘 Page 122-123 只有定义了android:id属性的控件在屏幕翻转后状态才会被持久化 Page 133 C ...
- [Everyday Mathematics]20150101
(1). 设 $f(x),g(x)$ 在 $[a,b]$ 上同时单调递增或单调递减, 试证: \[ (b-a)\int_a^b f(x)g(x)\mathrm{\,d}x \geq \int_a^b ...
- Sql2005 全文索引详解
1.前言 14.1 全文索引的介绍 14.2 全文索引中常用的术语 14.3 全文索引的体系结构 14.4 全文目录管理 14.4.1 创建全文目录 14.4.2 查看与修改全文目录 14 ...
- 《深入Java虚拟机学习笔记》- 第10章 栈和局部变量操作
Java栈和局部变量操作 Java虚拟机是基于栈的机器,几乎所有Java虚拟机的指令都与操作数栈相关.栈操作包括把常量压入操作数栈.执行通用的栈操作.在操作数栈和局部变量之间往返传输值. 1常量入栈操 ...
- Linux 多线程编程--线程退出
今天分析项目中进程中虚存一直增长问题,运行10个小时虚存涨到121G ,RSS占用为16G 非常恐怖. Valgrind测试无内存泄漏. 内存32G 64bit系统信息如下: Linux线程使用方式是 ...
- LeetCode题解——Longest Palindromic Substring
题目: 给定一个字符串S,返回S中最长的回文子串.S最长为1000,且最长回文子串是唯一. 解法: ①遍历,对于每个字符,计算以它为中心的回文子串长度(长度为奇数),同时计算以它和右边相邻字符为中心的 ...
- bzoj 2816: [ZJOI2012]网络(splay)
[题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=2816 [题意] 给定一个无向图,满足条件:从一个节点出发的同色边不超过2条,且不存在同 ...
- POJ 3254 poj3254 Corn Fields
题意:给出一个n行m列的草地,1表示肥沃,0表示贫瘠,现在要把一些牛放在肥沃的草地上,但是要求所有牛不能相邻,问你有多少种放法. 思路: DP[i][j]=sum(dp[i-1][k]); i表示当前 ...
- HW6.27
import java.util.Scanner; import java.util.Arrays; public class Solution { public static void main(S ...
- HW5.31
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...