CSS左右偏移

html-css05

CSS左右偏移,第1张

1、新建html文件。

2、创建两个div,并赋予id。

3、为两个div设置宽高和背景,并设置左右浮动。

4、预览效果如图。

5、创建第三个div。

6、为第三个div设置宽高和背景。

7、预览效果如图。

注意事项:

随着HTML的成长,为了满足页面设计者的要求,HTML添加了很多显示功能。但是随着这些功能的增加,HTML变的越来越杂乱,而且HTML页面也越来越臃肿。于是CSS便诞生了。

1、打开sublime text3,并且新建一个html文档和一个css文档。

2、把最基本的html框架写出来。

3、在html的head部分写上编码字符集并引入css文件。

4、在html的body里面写一个div,打上文字并设置一个class名。

5、在浏览器中打开,查看现在的效果。

6、我们直接在选择的div的class名里面加一个“margin: 0 auto”属性保存。

① 可以使用“相对定位”,position:relative;

② 注意坐标轴的移动方向:

向左移动:当然是正数->left:50px

向下移动:当然是正数->top:50px;

(这样记:既然要向下移动,当然是要远离top顶部了,自然top的属性值要正数

既然要向右移动,就是远离左边了,left属性值自然要为正数!!!)