垂直对齐：vertical-align属性
作者：ddcatlee 来源：豆豆猫的窝 发布时间：2008-07-11 20:55:00
上一小节讲解了行高与单行纯文字的垂直居中，而如果行内含有图片和文字，在浏览器内浏览时，读者可以发现文字和图片在垂直方向并不是沿中线居中，而是沿基线对齐，如图7-34所示。
图7-34 文字和图片内容默认垂直对齐方式为基线对齐
这是因为，元素默认的垂直对齐方式为基线对齐（vertical-align: baseline）。
7.4.1 语法
vertical-align属性的具体定义列表如下：
语法： vertical-align : baseline | sub | super | top | text-top | middle | bottom | text-bottom | <百分比> | <长度> | inherit
说明： 设置元素内容的垂直对齐方式
值： baseline：基线对齐；sub：下标；super：上标；top：顶端对齐；text-top：与文本的顶端对齐；middle：中部对齐；bottom：底端对齐；text-bottom：文本的底端对齐；
百分比和长度：CSS2，可为负数。
初始值： baseline
继承性： 不继承
适用于： 行内元素和单元格（table-cell）元素
媒体： 视觉
计算值： 百分比和长度值为绝对长度；其他同指定值
此处需要特别注意的是：垂直对齐属性只对行内元素有效。例如有如下代码：
<p style=”vertical-align:super;”>垂直对齐<span>上标</span></p>
<p>元素默认为块级元素，因此在浏览器内浏览时将不会有任何变化。而如下代码：
<p>垂直对齐<span style="vertical-align:super;">上标</span></p>
<span>元素默认为行内元素，因此显示如图7-35所示。
图7-35垂直对齐属性只对行内元素有效
行内元素还包括图片、表单输入元素等，同时，垂直对齐不能被继承。
0
投稿猜你喜欢
- 如何用OdbcRegTool组件来创建一个数据源？OdbcRegTool是一个免费组件，在服务器上安装后，就可以来创建一个数据源：<h
一个朋友给她的朋友买礼物。撕心裂肺、绞尽脑汁。最后蹦出来一个主意：“送打火机”我不知道小妞们通过哪的投票，就这么断定男人都喜欢打火机。导致一- 本月第一天日期SELECT FirstDayOfCurrentMonth = dateadd(mm,datediff(mm,0,getdat
- 今天是 Firefox3的2008下载日 ，这就意味着Firefox3正式发布了。Firefox3有众多的改进和新功能，我最关注的功能之一是
- 介绍两个关键的CSS <style media="print">
- SQL SERVER用来判断表或视图存在的语句在ORACLE中不能用，请问该怎么写。谢谢。答案exists(select tnam
- 同MongoDB，Redis这样的NoSQL数据库的复制相比，MySQL复制显得相当复杂！概述首先主服务器把数据变化记录到主日志，然后从服务
- 数据库：30万条，有ID列但无主键，在要搜索的“分类”字段上建有非聚集索引过程T-SQL： /* 用户自定义函数：执行时间在115
- 摘要: 本文由简到繁地介绍了以jQuery作为蓝本的js框架开发步聚, 希望借助本文大家对jQuery这样的框架内部有一个大致的认识。推荐：
- 一、原因：今天在尝试初始化一个WEB应用的时候，发现其连接不上MySQL，从Traceback看到使用的默认密码为‘YES’。没辙，居然尝试
- 假如读者已经熟悉了ASP 2.0，并正在寻找3.0版本中的实际改变的列表，那么将在下面发现这些信息。假如读者是一个ASP的初学者，可以越过本
- 利用MySQLfs这个工具，我么可以在MySQL关系数据库中存储文件系统。MySQLfs将文件系统中文件的字节内容分解成数据库中的元组，而数
- 很多现代的浏览器在地址栏的右边有个搜索框，默认的安装有 Google 搜索等。如下图所示： 其实这是 OpenSearch 的一
- 随机背景--当你每次进入该页面时，从已指定的图片文件夹中，随机选取一个图片作为背景显示。这里介绍的方法是用ASP+CSS来实现的。 &nbs
- 前言: 这篇文章主要介绍RMAN的常用方法，其中包含了作者一些自己的经验，里面的实验也基本全在WIN 2K和ORACLE 8.1.6环境下测
- IN主要用于传入参数,可以是变量,常量,表达式,在子程序内部不能改变其值. 代码如下:DECLARE n NUMBER := 10; PRO
- 我参与了IE7的开发过程，看到了在IE浏览器中形形色色使用MSXML的方法。显然有一些东西困扰着开发者：MSXML“混乱”的版本以及如何创建
- 这是 COMSHARP CMS 团队翻译的2009年海外Web设计风潮的第二部分，着重讲解了反 Box 式布局，单页布局，多栏布局，巨型插图
- 当你连接一个MySQL服务器时，你通常应该使用一个口令。口令不以明文在连接上传输。所有其它信息作为能被任何人读懂的文本被传输。如果你担心这个
- 1. ASCII 返回与指定的字符对应的十进制数; SQL> select ascii(A) A,ascii(a) a,ascii(0
