定位 , 锚点链接 盒子居中 ,透明度拓展

一.垂直对齐属性

vertical-align:top | middle | bottom  td

应用

1.解决图片3px 的问题 (给图片设置 vertical-align: 不是默认就可以)

2.表格内容的垂直对齐 td

注意 只能在行内块元素可以用  如 img  button  input

二.定位

概念:将一个元素放在指定的位置上 position

定位方式

1.静态定位

元素的默认的定位方式 static

2.固定定位

fixed 是基于浏览器当前屏幕进行定位

position:fixed;  left:*px ;  top:*px;

应用 小广告 返回顶部  在线客服 顶部导航

3.相对定位

基于元素本身所在的位置  relative  用于子绝父相

4.绝对定位

基于被设置非静态定位的最近上级进行定位  如果没有 基于浏览器第一屏定性定位.

position:absolute;  left:*px; top:*px;

注意条件: 上级  被设置非静态定位  最近

三.锚点链接

内容

注意:必须使用id标签

有多个a 把他放在一个大盒子才不会出现重叠

四.z轴上的堆叠层次

z-index:数字

元素的默认为0  越大越在上面 可以为负数

五.拓展

1.实现一个盒子完全居中于一个未知大小的盒子

方法1.position:fixed;  top:50%;  left:50%; margin-top:-盒子高度一半  margin-left:盒子宽度一半

方法2.position:fixed;  top:0;  left:0;  right:0;  bottom:0;  margin:auto;

2.透明度

opacity:0-1的数字

filter:alpha(opacity=0-1的数字) 兼容低版本  其中0代表完全透明

你可能感兴趣的:(定位 , 锚点链接 盒子居中 ,透明度拓展)