垂直对齐：vertical-align属性（3）
作者：ddcatlee 来源：豆豆猫的窝 发布时间：2008-07-11 20:55:00
标签：垂直,对齐,属性,css
7. 上标和下标
上标（vertical-align:super）使元素的基线（替换元素的底端）相对于父元素的基线升高，下标（vertical-align:sub）使元素的基线降低，移动的幅度CSS规范中没有规定，由浏览器来决定。例如有如下代码，其显示如图7-43所示。
<p>上标文字<span style="vertical-align:super;">vertical-align:super;</span>下标文字<span style="vertical-align:sub;">vertical-align:sub;</span></p>
图7-43 上标和下标
上下标不会改变元素文字的尺寸大小。
8. 长度值和百分比
和上下标类似，长度值和百分比值可使元素的基线（替换元素的底端）相对于父元素的基线升高（正值）或者降低（负值）。
上下标的移动尺寸是由浏览器确定的，而设定长度值或者百分比，可以精确控制文字上下移动的幅度。
百分比与行高有关，例如有如下代码，其显示如图7-44所示。
p { line-height : 2em; }
<p>行高2em，纵向百分比对齐：<span style="vertical-align:100％;">100％正数向上</span>，而<span style="vertical-align:-100％;">-100％负数向下</span>。</p>
图7-44 百分比对齐
设置垂直对齐会影响到行框高，例如有如下代码，其显示如图7-45所示。
p { line-height : 2em; }
<p>垂直对齐<span style="vertical-align:2em;">正数向上</span>，而<span style="vertical-align:-2em;">负数向下</span>。<p>行高2em，而设置垂直对齐的文字撑开了行框。</p>
图7-45 垂直对齐对行框的影响
注意：在IE中设定百分比或者数值对齐会造成内容的叠加混乱，如图7-46所示。
图7-46 IE中的叠加混乱
0
投稿猜你喜欢
- 网页兼容测试，除了做不同浏览器的兼容测试，还要观察网页在不同分辨率下的表现情况。在页面中使用了CSS绝对定位，发现在宽屏下错位。随后测试非1
- 可控制的滚动新闻不同于自动的滚动条，它是通过按钮控制移动的，当你把鼠标放在按钮上时，新闻内容就会向上或
- asp连接sql 第一种写法： 代码如下: MM_conn_STRING = "Driver={SQL Server};serv
- 1.已知有一个XML文件（bookstore.xml）如下： <?xml version="1.0" e
- 在学会了SELECT语句的构造和用途之后你就该学习如何使用它了。在你所掌握的数据库工具下，这可能意味着你得按下某个写着“执行”字样的按钮。在
- 本文介绍的MySQL数据库的出错代码表，依据MySQL数据库头文件mysql/include/mysqld_error.h整理而成。详细内容
- Apple4.us的张亮问我：“很多人说用户体验是苹果的核心竞争力。在用户体验方面，我究竟该从苹果的设计中学习什么” ？关于这个问题的答案我
- 简单的说，一个数据库管理系统应该的提供的基本服务有两种：1.数据访问。对每个数据库管理系，数据访问服务都包含一下几种(1)插入--向数据库中
- 根据Nicholas的说法，有四种代码会拖慢脚本的运行，并最终导致脚本失控。分别是次数过多的同步循环、庞大的函数体、不恰当的递归和不合理的D
网上有很多关于PHP在IIS下配置的教程,但都是一些很理性化的东西,我从里面整理出来这个教程 发出来为了方便参考,有什么问题也可以大家一起交- 删除备份和还原历史记录表中所有早于 oldest_date 的备份集的项目。由于执行备份或还原操作时会在备份和还原历史记录表中添加行，sp_
- 1. 检查HTML元素是否有拼写错误、是否忘记结束标记 即使是老手也经常会弄错div的嵌套关系。可以用dreamweaver的验证功能检查一
- Union 与 Union ALL 的作用都是合并 SELECT 的查询结果集，那么它们有什么不同呢？ Union 将查询到的结果集合并后进
- 通常情况下，即使MyISAM表格式非常可靠（SQL语句对表做的所有改变在语句返回之前被写下），如果下列任何事件发生，你依然可以获得损坏的表：
- 机器A: select instance_name from v$instance; select name from v$database
- 修改MySQL下的默认mysql数据库的user表，删除所有host为localhost记录，另外添加一些其他记录，重新启动MySQL服务器
- HTTP头中一般断点下载时才用到Range和Content-Range实体头，Range用户请求头中，指定第一个字节的位置和最后一个字节的位
- 微软在今天早上发布新的安全通告证实，一处远程执行代码漏洞影响到了整个SQL Server产品线。该漏洞的入侵代码在两周前已经被公布在互联网上
- 建立资料表：Step1首先开启phpmyadmin，进入wordpress资料库中，并新增一个wp_gbook的资料表与栏位数目8。Step
- 产品通常分两种，一种是遵循现有用户习惯，一种是颠覆用户习惯。至于什么是用户习惯，你现在用右手还是左手操作鼠标，这就是你的习惯。很多公司团队专
