1. 对齐常量(text-align和vertical-align)

1.1 盒外对齐

这种对齐属性决定环绕着元素外部矩形空间的文本对齐方式。W3C中,这类HTML元素包括:applet、iframe、img、input和object。IE还支持embed、fieldset和select,但不支持iframe元素。以下是受到广泛支持的元素对齐属性:

absbottom:使文本的最底端与元素的最底端保持在同一水平线上。

absmiddle:使文本高度的中部与元素高度的中部水平对齐。

abseline:文本的基线与元素最下端水平对齐。注意,文本的下行笔画位于基线以下。

bottom:W3C认可的值,与abseline等同。

left:如果元素所在行之前已经有文本存在,则该元素会移动至下一行,并显示在相邻的最外层容器的左侧。元素之后的文本将紧跟着元素之前的文本,使得整段文本环绕在对象或图像的周围(这种效果称为浮动)。W3C认可的值。

middle:文本的基线与元素高度的中央对齐。W3C认可的值。

right:如果元素所在行之前已经有文本存在,则该元素会移动至下一行,并显示在相邻的最外层容器的右侧。元素之后的文本将紧跟着元素之前的文本,使得整段文本环绕在对象或图像的周围(这种效果称为浮动)。W3C认可的值。

texttop:元素的最上边与其前面的文本的上行笔画位于同一水平线。

top:元素的最上边与同一行中最高的元素(文本或其他元素)上边界对齐。W3C认可的值。

1.2 容器盒内文本对齐

bottom:文本底部与相关元素底部对齐,或位于该元素盒下边。浏览器只会针对caption元素执行这种对齐方式。

center:文本位于相关元素盒的顶部或上部,并水平居中。虽然此值并未被W3C所认可,但现在的浏览器依然支持在caption元素使用该属性,但legend元素在Safari或Opera中则无法使用该属性。

left:虽然W3C认可此值(这个值表明文本应该位于容器元素的左侧),但对于legend元素而言,浏览器将文本对齐在盒子的左上部。而对于caption元素,只有Mozilla浏览器会将标题本文放在元素左边。

right:虽然W3C认可此值(这个值表明文本应该位于容器元素的右侧),但对于legend元素而言,浏览器将文本对齐在盒子的右上部。而对于caption元素,只有Mozilla浏览器会将标题本文放在元素右边。

top:legend元素的文本将在容器盒的左上部对齐,而caption元素的文本将在中上部对齐。这是W3C认可的值。

Dynamic HTML权威指南(读书笔记)— 第一章 HTML与XHTML参考的更多相关文章

  1. HTTP权威指南读书笔记——第一章(HTTP概述)

    1.HTTP(Hypertext Transfer Protocol,超文本传输协议)是在万维网上进行通信时所使用的协议方案,HTTP是应用层协议,无需关心网络通信的细节,细节交给了传输层协议TCP/ ...

  2. JavaScript权威指南读书笔记【第一章】

    第一章 JavaScript概述 前端三大技能: HTML: 描述网页内容 CSS: 描述网页样式 JavaScript: 描述网页行为 特点:动态.弱类型.适合面向对象和函数式编程的风格 语法源自J ...

  3. css权威指南读书笔记-第10章浮动和定位

    这一章看了之后真是豁然开朗,之前虽然写了圣杯布局和双飞翼布局,有些地方也是模糊的,现在打算总结之后再写一遍. 以下都是从<css权威指南>中摘抄的我认为很有用的说明. 浮动元素 一个元素浮 ...

  4. Android权威编程指南读书笔记(1-2章)

    第一章 Android应用初体验 1.4用户界面设计 <?xml version="1.0" encoding="utf-8"?> ADT21开发版 ...

  5. HTTP权威指南读书笔记

    HTTP权威指南笔记 读书有两种境界,第一种境界是将书读薄,另一种是读厚.本篇文章就是HTTP权威指南的读书笔记,算是读书的第一重境界,将厚书读薄.文章对HTTP的一些关键概念做了比较详细的概述,通读 ...

  6. HTTP权威指南阅读记录 - 第一章

    最近终于开始看<HTTP权威指南>了,第一章主要是简介一些基本的概念.下面列出一些常用,但还不是很了解的简单概念. 一.常见概念: 1.媒体类型 因特网上有数千种不同的数据类型,HTTP仔 ...

  7. 《css3实战》读书笔记 第一章 基于CSS需求而编写的HTML.

    笔记说明 <CSS3实战手册第3版(影印版)>可以消除Web设计工作的痛苦,并且带给你:HTML--重新入门.如果你是HTML新手,你会学到如何以CSS友好的方式进行基本页面构造.若你是H ...

  8. 《疯狂Java:突破程序员基本功的16课》读书笔记-第一章 数组与内存控制

    很早以前就听过李刚老师的疯狂java系列很不错,所以最近找一本拿来拜读,再此做下读书笔记,促进更好的消化. 使用Java数组之前必须先对数组对象进行初始化.当数组的所有元素都被分配了合适的内存空间,并 ...

  9. css权威指南读书笔记

    今天翻手机,翻到了许久之前看css权威指南时的笔记,遂移到博客中来. 1.属性选择器p.one class名为one的p元素p[class][name] 含有class和name属性的p元素p[cla ...

  10. Getting Started With Hazelcast 读书笔记(第一章)

    第一章:数据集群的演化与 早期的服务器架构 显然,应用是可扩展的,但是由于是集中式服务器,随着数据库性能达到极限,再想扩展就变得极端困难,于是出现了缓存.    缓存显然再次提升了可扩展性,减轻了数据 ...

随机推荐

  1. 玩转 HTML5 下 WebGL 的 3D 模型交并补

    建设性的立体几何具有许多实际用途,它用于需要简单几何对象的情况下,或者数学精度很重要的地方,几乎所有的工程 CAD 软件包都使用 CSG(可以用于表示刀具切削,以及零件必须配合在一起的特征).CSG ...

  2. 【机器学习实战】第15章 大数据与MapReduce

    第15章 大数据与MapReduce 大数据 概述 大数据: 收集到的数据已经远远超出了我们的处理能力. 大数据 场景 假如你为一家网络购物商店工作,很多用户访问该网站,其中有些人会购买商品,有些人则 ...

  3. Nodejs学习笔记(十五)--- Node.js + Koa2 构建网站简单示例

    目录 前言 搭建项目及其它准备工作 创建数据库 创建Koa2项目 安装项目其它需要包 清除冗余文件并重新规划项目目录 配置文件 规划示例路由,并新建相关文件 实现数据访问和业务逻辑相关方法 编写mys ...

  4. 使用.NET Core在RESTful API中进行路由操作

    介绍 当列出REST API的最佳实践时,Routing(路由)总是使它位于堆栈的顶部.今天,在这篇文章中,我们将使用特定于.NET Core的REST(web)API来处理路由概念. 对于新手API ...

  5. C语言控制流语句

    title: 2017-10-18控制流 tags: binsearch else-if, shellsort, insertsort grammar_cjkRuby: true --- 前段时间忙着 ...

  6. 熊掌号:"搜索+信息流"双引擎与"百家号+熊掌号"双品牌内容平台

    一. 熊掌号是什么?熊掌号简单来说,就是"搜索 + 信息流"双引擎与"百家号 + 熊掌号"双品牌内容平台,上线了,对站长还是企业,都是一件好事.只要写出优质的原 ...

  7. iOS11、iPhone X、Xcode9 适配

    更新iOS11后,发现有些地方需要做适配,整理后按照优先级分为以下三类: 1.单纯升级iOS11后造成的变化: 2.Xcode9 打包后造成的变化: 3.iPhoneX的适配 一.单纯升级iOS11后 ...

  8. POJ1082食物链

    加权并查集入门习题. 传送门http://poj.org/problem?id=1182 下面来记录一下做法: 并查集的作用是询问两个对象时候在同一集合以及将两个非空不相交集合合并. 本题涉及两点之间 ...

  9. Python 爬虫练习(一) 爬取国内代理ip

    简单的正则表达式练习,爬取代理 ip. 仅爬取前三页,用正则匹配过滤出 ip 地址和 端口,分别作为key.value 存入 validip 字典. 如果要确定代理 ip 是否真的可用,还需要再对代理 ...

  10. JavaScript提高篇之面向对象之单利模式工厂模型构造函数原型链模式

    1.单例模式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...