CSS布局:对齐

css对齐

Last Updated on

css对齐:CSS行高垂直外边距可以使用水平内边距、边框和外边距调整它们的间距。但是,垂直内边距、边框和外边距不影响行内框的高度。已经知道如何控制布局中元素的整体大小。我们将深入学习排列元素,创建列、定位logo、tetx调整文本等等。学习CSS居中的经典方法,浮动float和清除clear属性,如何text-align对齐文本,以及block和inline元素之间的差异。

css对齐常常包括有:居中对齐,文字两端对齐,两端对齐,右对齐,左对齐,靠右对齐,文字对齐,底部对齐,文字左对齐,垂直对齐,文字左右对齐,html两端对齐,div居中对齐。

1、float
content-left的width;

content-right的width

2、clear的两种写法:
1、.clear
clear:both

2、伪类
1、.clearfix:before,.clearfix:after
content:” “;
display:table;
2、.clearfix:after
clear:both
3、添加在float元素的父辈;

3、margin会导致额外的空间:
1、wrapper
width:100%;
max-width:80rem;
margin-left:auto;
margin-right:auto;
—-
margin:0 auto;

4、header的logo的h1隐藏

5、header和footer的内容可以用text-align:center剧中
1、header和footer里面的元素属于inline元素:

2、div元素属于block元素;

3、img,text(排版里面所有的元素,p,h1-h6,img)属于inline元素;

4、inline元素就是我们能够在body的text添加inline属性;

5、center inline元素:
1、text-align:center;

6、center block元素:
1、用margin

技巧:查看元素-computed-display属性;

Last modified: 2019年8月31日

前一篇

CSS学习系列

CSS布局:使用控制布局元素

在CSS中布局基本上有四个组成:(sizing)尺寸大小,(alignment)对齐,(spacing)间距和(responsiveness)响应。通过使用高度、最小高度、最大高度、宽度、最小宽度和最大宽度属性来了解CSS布局的尺寸大小。

...

后一篇

CSS学习系列

CSS排版:数值和单位

CSS单位:对于网页布局的单位,只知道 px 是仅仅不够的,还需要知道其他几个比较常见的单位,特别是css3推出的一些新的度量单位, em是一种相对单位,它相对于父元素的字体大小,设置排版的font-size和line-height属性时.

...