JavaWeb_CSS（14）_文字处理_字体和字号
文字处理
字体
示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>www.weiyuxuan.com</title>
<style type="text/css">
h1
{
font-family: 黑体;
}
.author
{
font-family: 宋体;
}
.content
{
font-family: 楷体;
}
</style>
</head>
<body>
<h1>赤壁赋</h1>
<hr/>
<p class="author">作者：苏轼</p>
<p class="content"> 壬戌之秋，七月既望，苏子与客泛舟游于赤壁之下。清风徐来，水波不兴。举酒属客，诵明月之诗，
歌窈窕之章。少焉，月出于东山之上，徘徊于斗牛之间。白露横江，水光接天。纵一苇之所如，凌万顷之茫然。浩浩乎如凭虚御风，
而不知其所止；飘飘乎如遗世独立，羽化而登仙。<br/> 于是饮酒乐甚，扣舷而歌之。歌曰：“桂棹兮兰桨，击空明兮溯流光。渺渺兮予怀，
望美人兮天一方。”客有吹洞箫者，倚歌而和之。其声呜呜然，如怨如慕，如泣如诉；余音袅袅，不绝如缕。舞幽壑之潜蛟，泣孤舟之嫠妇。
<br/> 苏子愀然，正襟危坐而问客曰：“何为其然也？”客曰：“月明星稀，乌鹊南飞，此非曹孟德之诗乎？西望夏口，东望武昌，山川相缪，
郁乎苍苍，此非孟德之困于周郎者乎？方其破荆州，下江陵，顺流而东也，舳舻千里，旌旗蔽空，酾酒临江，横槊赋诗，固一世之雄也；
而今安在哉！况吾与子渔樵于江渚之上，侣鱼虾而友麋鹿，驾一叶之扁舟，举匏樽以相属。寄蜉蝣于天地，渺沧海之一粟。哀吾生之须臾，
羡长江之无穷。挟飞仙以遨游，抱明月而长终。知不可乎骤得，托遗响于悲风。”<br/> 苏子曰：“客亦知夫水与月乎？逝者如斯，而未尝往
也；盈虚者如彼，而卒莫消长也。盖将自其变者而观之，则天地曾不能以一瞬；自其不变者而观之，则物与我皆无尽也，而又何羡乎？且夫
天地之间，物各有主，苟非吾之所有，虽一毫而莫取。惟江之清风，与山间之明月，耳得之而为声，目遇之而成色，取之无禁，用之不竭。
是造物者之无尽藏也，而吾与子之所共适。”<br/> 客喜而笑，洗盏更酌。肴核既尽，杯盘狼藉。相与枕藉乎舟中，不知东方之既白。</p>
</body>
</html>
结果图：
文字大小
大小单位
-
px
相对长度单位。像素（Pixel）。
像素是相对于显示器屏幕分辨率而言的。譬如，windows 的用户所使用的分辨率一般是 96 像素/英寸。而 MAC 的用户所使用的分辨率一般是 72 像素/英寸。 -
em
相对长度单位。相对于当前对象内文本的字体尺寸。
如当前行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。 -
ex
相对长度单位。相对于字符“x”的高度。此高度通常为字体尺寸的一半。
如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。 -
pt
绝对长度单位。点（Point）。
1in = 2.54cm = 25.4 mm = 72pt = 6pc -
pc
绝对长度单位。派卡（Pica）。相当于我国新四号铅字的尺寸。
1in = 2.54cm = 25.4 mm = 72pt = 6pc -
in
绝对长度单位。英寸（Inch）。
1in = 2.54cm = 25.4 mm = 72pt = 6pc -
mm
绝对长度单位。毫米（Millimeter）。
1in = 2.54cm = 25.4 mm = 72pt = 6pc -
cm
绝对长度单位。厘米（Centimeter）。
1in = 2.54cm = 25.4 mm = 72pt = 6pc
示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>www.weiyuxuan.com</title>
<style>
p.inch
{
font-size: 0.5in;
}
p.cm
{
font-size: 0.5cm;
}
p.mm
{
font-size: 4mm;
}
p.pt
{
font-size: 12pt;
}
p.pc
{
font-size: 2pc;
}
p.px
{
font-size: 12px;
}
</style>
</head>
<body>
<h1> 字体大小 </h1>
<hr/>
<p class="inch">文字大小，0.5in </p>
<p class="cm">文字大小，0.5cm </p>
<p class="mm">文字大小，4mm </p>
<p class="pt">文字大小，12pt </p>
<p class="pc">文字大小，2pc </p>
<p class="px">文字大小，12px </p>
</body>
</html>
结果图：
如有错误，欢迎指正！