前言

不知道大家在学习 H5 的时候，有没有疑惑过，对于 align 和 valign 两种对齐方式在不同的情境下往往会有不同的取值，所表示的意思也都不尽一样。下面我就简单做一个小结，将我在学习 H5 过程中曾经疑惑过的几条做一个总结。

一、align 与 valign 的对齐方式与取值

align 设置水平对齐方式，取值：left、center、right
valign 设置垂直对齐方式，取值：bottom、middle、top

二、常见应用区分整理

对于下面不同情况的不同取值我将持续更新，也积极欢迎大家进行补充。

2.1、H5 页面设计的取值

在 H5 页面设计时，图片标记的对齐方式 align 取值为 top、bottom、middle、left、right 五个值。

具体取值情况如下图所示：

2.2、表格标题的取值

在设计表格标题时，<caption>标记对齐属性为 align 和 valign 两个值，但是 valign 取值只有 top（默认）和 bottom 两个值。

具体取值情况如下如所示：

2.3、表格属性的取值

在设计表格<tr>属性时，valign 取值则可取三个值，默认是 middle，即垂直居中对齐。align 此时默认取值是 left，即左对齐。

总结

本文是对 H5 中对齐方式的一个小结，在不同的情境下往往取值会有不同的效果，我会不断补充我开发中所遇到的，也欢迎大家前来积极补充。

我是白鹿，一个不懈奋斗的程序猿。望本文能对你有所裨益，欢迎大家的一键三连！若有其他问题、建议或者补充可以留言在文章下方，感谢大家的支持！

在前端网页设计中 align 和 valign 两种对齐方式的不同取值区分（持续补充）相关推荐

网页设计中最常见的9种设计风格
网页设计中最常见的9种设计风格如今的网站千千万,每个网页设计都有自己独特的风格.今天唐人设计就来为大家总结网页设计中最常见的9种设计风格,一起来看看吧! 扁平化设计可以说是时下最常用的网页设计风 ...
pcb 理论阻值、过孔_超实用！PCB设计中过孔常用的6种处理方式
原标题:超实用!PCB设计中过孔常用的6种处理方式小伙伴们我们又见面啦! 上一次的" 神仙过孔 ",还没过瘾吧? <整齐的过孔固然符合审美,但是却...> 今天的小课 ...
java map遍历_Java中Map集合的两种遍历方式
Java中的map遍历有多种方法,从最早的Iterator,到java5支持的foreach,再到java8 Lambda,让我们一起来看下Java中Map集合的两种遍历方式! 关于遍历Map集合的几 ...
java中两种遍历集合的方式_Java中Map集合的两种遍历方式
Java中的map遍历有多种方法,从最早的Iterator,到java5支持的foreach,再到java8 Lambda,让我们一起来看下Java中Map集合的两种遍历方式! 关于遍历Map集合的几 ...
1.JavaScript中定义数组的两种主要方式
JavaScript中定义数组的两种主要方式(new Array()和[]方式) new Array() ①可以用像JAVA的那种写法的方式定义,如 var arr = new Array() 这样定 ...
ajax onload怎么用,Ajax中onload和onreadystatechange两种请求方式的区别
一. onreadystatechange 1. XMLHttpRequest对象有一个属性readyState,将其(xhr.readyState)打印后发现.进入onreadystatechang ...
Java中定义字符串的两种常见方式、使用==和equals()比较字符串
在讲使用==和equals()比较字符串之前,我们首先要讲定义字符串的两种常见方式,一种是定义一个常量,即直接定义字符串,一种是通过new关键字定义一个变量,即使用String类定义字符串,如下图: ...
Java中匿名类的两种实现方式
使用匿名内部类课使代码更加简洁.紧凑,模块化程度更高.内部类能够访问外部内的一切成员变量和方法,包括私有的,而实现接口或继承类做不到.然而这个不是我说的重点,我说的很简单,就是匿名内部类的两种实现方式 ...
java中字符串的创建_【转载】 Java中String类型的两种创建方式
本文转载自 https://www.cnblogs.com/fguozhu/articles/2661055.html Java中String是一个特殊的包装类数据有两种创建形式: String s ...

在前端网页设计中 align 和 valign 两种对齐方式的不同取值区分（持续补充）

文章目录

前言