1.6 结合使用关键字和百分比值
要更好地利用将关键字和百分比值结合使用的优势,必需牢记一些规则。下面的内容,对于该如何正确地调整百分比值应该有所帮助,我们还要提出一个针对嵌套使 用百分比的警告。
1.6.1 设定一个中间的关键字基准值
在设定基准文字大小时,有一个有用的诀窍,即用一个包围所有对象的<div>来 帮助调整关键字值。多数情况下,在建立基于 CSS 的布局时,我们都会出于各种和设 计相关的理由,使用一个<div>(参见第 8 章)在基准关键字之上设定一个能影响整个页 面的百分比值。
例如,现在准备处理如下 H T M L 代码:
<body>
<div id="container">
<h1>This is a Title</h1>
<p>This is body text at default base size.</p>
</div>
</body>
如同本章前面完成的那些工作一样,我们可以设置一个基准关键字值,以及一个 有较大百分比值的<h1>对象:
body {
font-size: small;
}
h1 {
font-size: 150%;
}
|
但是如果我们感觉small值相对于我们的喜好还偏大了一点(在浏览器的默认设置情 况下查看时),我们可以通过给 #container 这个包围了页面上所有文字的对象设置一 个百分比,来让这个基准值实际上变小一些:
body {
font-size: small;
}
h1 {
font-size: 150%;
}
#container {
font-size: 95%;
}
|
如图 1 - 9 所示,文字从默认大小减下来了一些,同样也影响到了大标题文字。
![]() |
| 图 1-9 这里是使用基准关键字值 small,
和将容器的文字大小设定为 95% 后的显示效果的比较 |
图 1-9 中,第一张图显示的是添加了规则使得 #container 的 font-size 被渲染为 95% 时的效果,第二张图则是页面在只使用关键字值 small 时的效果。两者的差别 其实很小。
当想用到一个介于两个关键字值之间的文字大小时,这便是一种很有用的方法, 能够更佳精确地设定大小值。使用这个包围了整个页面的<div>,可以在关键字的基 础上增大或者减小,实现自定义的基准文字大小。
我们最好是别追究太细节的东西,然而,不同的浏览器 - 系统平台的组合之间总是 可能存在微小的显示差别。但重要的在于,用户仍然可以通过浏览器内置的功能控制文字大小 。
| 回书目 上一节 下一节 |
|
· Linux笔试面试题选摘测.. · 08年5月软考网管上午真.. · 性能测试从零开始 目录 · 08年5月软考网工上午真.. · 上周拒绝服务攻击(DDo.. · 08年5月各大网上书店及.. |
· 2008年5月24日软考试题.. · 软件设计师专家临考模.. · 上周网络管理员专家自.. · 网络工程师自测获奖名.. · 08年4月各大网上书店及.. · 系统分析师自测获奖名.. |
|
||||
| · ASP.NET开发教程 · 专题:ASP.NET 2.0基础.. · LAMP技术精解 · 服务器节能与绿色IT · ARP攻击防范与解决方案 · Linux 集群技术专题 · Windows集群服务应用 · CISSP认证成长之路 |
· SQL Server 2008/2005.. · SQL Server入门到精通 · 网络工程师职业规划与.. · 浏览器的战国时代 · 运营商封堵ADSL共享 中.. · 微软出价446亿美元收购.. · 技术人求职简历完备手册 · 开源虚拟化技术Xen |
|||
|
||||
| · SOA 面向服务架构 · SQL Server 2008/2005.. · Apache技术专题 · 三层交换技术专题 · SQL Server入门到精通 · Apache技术专题 · Windows集群服务应用 · 国际文档格式标准开战 |
· 路由器设置与口令恢复 · Linux 集群技术专题 · PHP开发应用手册 · SOA 面向服务架构 · 企业数据恢复指南 · 了解统一威胁管理(UTM).. · 专题:AIX操作系统管理.. · 访问控制列表(ACL)介绍 |
|||
|
||||
| · SQL Server入门到精通 · SQL Server 2008/2005.. · SOA 面向服务架构 · Apache技术专题 · 三层交换技术专题 · Apache技术专题 · 企业数据恢复指南 · Windows集群服务应用 |
· 路由器设置与口令恢复 · Linux 集群技术专题 · SOA 面向服务架构 · 了解统一威胁管理(UTM).. · 反垃圾邮件技术应用 · 访问控制列表(ACL)介绍 · ASP.NET开发教程 · PHP开发应用手册 |
|||