【CSS学习】--- 文本水平对齐属性text-align和元素垂直对齐属性vertical-align

一、文本水平对齐属性---text-align

  text-align属性是将块级标签以及单元格里面的内容进行相应的对齐,块级标签里的内联元素会被整体进行移动,而子块级元素或子单元格则会继承父元素的text-align属性。

 属性值:

【CSS学习】--- 文本水平对齐属性text-align和元素垂直对齐属性vertical-align_第1张图片

 


<div style="text-align: center;">
    <span style="background-color: yellow;">test textspan>
    <br>
    <img src="http://h5ip.cn/oK0T" style="border: solid 1px red;">
div>

 


<div style="width: 200px; text-align: center; border: solid 1px blue;">
    <div style="width: 100px; height: 60px; border: solid 1px black;">
        <span>testspan>
    div>
div>

 

 二、元素垂直对齐属性---vertical-align

   vertical-align 属性设置行内元素的垂直对齐方式,在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。

属性值:

【CSS学习】--- 文本水平对齐属性text-align和元素垂直对齐属性vertical-align_第2张图片

 

 

三、最后

 慢慢补充吧。

转载于:https://www.cnblogs.com/huwt/p/10459274.html

你可能感兴趣的:(【CSS学习】--- 文本水平对齐属性text-align和元素垂直对齐属性vertical-align)