CSS入门(2)-浮动&盒子模型

如何给div设置背景图片：

通过id选择器选择div，然后通过如下css代码进行添加背景图片

#mid{
    background-image: url(../img/regist_bg.jpg);
}

text-align是css的一种对齐样式，它针对的是元素中内容的对齐方式。

align是html的标签内的一个属性，它针对的是元素本身的对齐方式。因为只看了table的一些功能，别的不做比较。对于table而言，如果直接在<table>标签内添加align=center属性，那么这个table就会水平居中显示。而如果在单元格<td>内使用align=center属性的话，就会让里面的内容水平且垂直居中。那么如何让table直接水平且垂直居中呢，可以通过css中的display进行设置，display默认是inline，也就是内联元素。但是当display：table时就会将这个块当成table来使用。具体操作如下：

1是在table的tr标签内在添加一个table，然后tr的align设置为center。

2是用css的display：flex来进行布局 align-teams：center，这个是设置垂直布局，然后再通过table的margin：auto，来设置水平布局。但是要记住一点，必须是第一级子标签就是table，如果中间在加了别的标签就无法实现。

关于display属性，下面是详细介绍。

http://www.runoob.com/cssref/pr-class-display.html

1.text-align用来设置元素中的的文本对齐方式，例如：如果需要设置图片的对齐方式，需要设置图片的父元素的text-align属性；

2.text-align只对文本有效，对元素无效，不能设置元素的对齐方式；

3.表格元素td是属于inline-block，可以使用text-align设置td中的文本对齐方式；其实通过<th>标签可以直接让内部内容居中，不需要再添加其他设置。

关于对齐的一篇文章

www.cnblogs.com/cainiao-Shun666/p/6622728.html

在我们设置padding的时候，如果增加100px，实际上整个盒子，都会增加100px。例如：一开始我们设置的height：500px，然后这时我们再设置padding-top:100px,这时整个呃height就会变成600px，所以设置完padding之后一定要将原height删掉增加的padding部分。