CSS中,text-align和line-height的使用

text-align:以值为center为例,当前块级容器里的所有行内元素(包括img)在当前容器中横向居中,所有子块级容器里的所有行内元素在它的直接父容器中居中,不影响块级元素的位置,如例1

块级元素居中可以用 margin:*px auto;

line-height:可以用在段落中,改变多行文字之间的行距;把某容器的line-height设置与height相同的值,可以使容器中的一行内容纵向居中,仅限一行内容(不要含
,块级元素前后隐含
),效果如下图,对行内元素(包括img)有效,对块级元素无效,但对块级元素里的行内元素有影响,当img的高与容器高相差不大时,居中效果不明显。

CSS中,text-align和line-height的使用_第1张图片CSS中,text-align和line-height的使用_第2张图片CSS中,text-align和line-height的使用_第3张图片CSS中,text-align和line-height的使用_第4张图片CSS中,text-align和line-height的使用_第5张图片

例1:

CSS中,text-align和line-height的使用_第6张图片



	
		
		
		
		
	
	
		
ddd
div span
little

h1

ppp

huhihdiv span

 

你可能感兴趣的:(CSS中,text-align和line-height的使用)