1定位与 2一些小标签的使用 3版心作用 4元素之间的转换 5项目准备

1定位的使用:

1固定定位(position:fixed) 2绝对定位(position:absolute) 3相对定位(position:resitive) 4静态定位(position:static)默认
脱标 脱标 不脱标 不脱标
模式转换(inline-block) 模式转换(inline-block) 模式不转换(占据原来在标准流里的位置 模式不转换
相对浏览器定位

父盒子无定位(static):相对浏览器

父盒子有定位(除是static):

相对父盒子

相对原来位子定位 没有作用
       
       
       
       

 

1.1    子绝父相 

子元素是绝对定位的时候,父元素是一个相对定位,那么 父级元素是给子元素设置范围的作用

如果三个元素之间的嵌套的话,就不一定非得是子绝父相,子绝父绝爷相。

定位首先是先找离自己最近的父级元素进行的一个定位,如果父级元素没有定位(static默认)话,默认是以浏览器或是文档的左上角为准,如果父级元素有定位(除static)的时候,以父级元素的左上角为准。

1.2层级

层级:

z-index:number

控制的是定位里层级

static定位是无法使用z-index的

2小标签作用:

一般起一些装饰性的作用

 i  s   em   u    del   ins

3版心作用:

因为设备的分辨率不同,为了适应各种设备,做兼容,是样式风格相同。

概念:

 所谓版心也就是页面中主要内容所在的区域,即页面正中的位置。

4元素之间转换:

1.display

2脱标:1浮动(float)

    2定位(position:absolute和fixed)

5项目准备:

1配置环境:编辑软件 webstrom sublime vscode  Hbuilder  atom


2项目文件夹:便于管理

css文件夹

js文件夹

images文件夹

音频和视频文件夹

3样式初始化:除去浏览器的默认样式,使之同一

4分析构成:

   做网站的时候也有一个规范或是通例 

   布局的顺序一般是从上到下,从左到右

   在写页面的时候,一般考虑使用标准流的元素,其次才使用浮动或是定位。

原文地址:https://www.cnblogs.com/wjl3898/p/5698190.html