css中元素的位置

一.display

  1.display:none  隐藏标签

  2.display:inline  将块级标签改为内联标签

  3.display:block  将内联标签改为块级标签

  4.display:inline-block  块级内联兼并,不独占一行,可以设置宽高

二.float浮动

  任何元素都可以浮动,浮动后就变成了块级标签,它会尽可能窄,造成塌陷,所以要clear清除浮动(relative也属于浮动)

  1.float:none  默认值,不浮动

  2.float:left  左浮动

  3.float:right  右浮动

三.clear 

.clearfix:after {
    content: '';
    display: block;
    clear: both;
}
clear清除浮动后父级标签塌陷

  1.clear:left  左侧不允许有浮动

  2.clear:right  右侧不允许有浮动

  3.clear:both  两侧都不允许有浮动

四.overflow溢出

  overflow-x\overflow-y能独自设置x\y轴的内容

  1.overflow:visible  默认值,不会做出任何处理

  2.overflow:hidden  隐藏溢出内容

  3.overflow:scroll  滚动溢出内容

五.position定位

  1.position:relative  相对自身位置移动

  2.position:absolution  根据有relative的父级以上级别(都没有就按body)的位置作为相对位置进行移动

  3.position:fixed  根据窗口进行移动

  left\right\top\bottom:10px

六.z-index

  如果定位后覆盖了其他标签,又想优先显示其他标签,就可以用z-index给标签设置优先级

  z-index:1000;  谁的数值大就优先显示谁

七.opacity  

  给标签内所有内容定义透明度

猜你喜欢

转载自www.cnblogs.com/q767498226/p/10380722.html