菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: css定位叠放次序_汪刚_2023.4.20 [打印本页]

作者: 霁后彩虹O 时间: 2023-4-20 01:34
标题: css定位叠放次序_汪刚_2023.4.20
今日所学内容· 1.定位的叠放次序

· 在使用定位的时候，可能会出现盒子重叠的情况，可以使用z-index属性来控制盒子的前后顺序

· 属性值

· 可以是正整数、负整数、或者0，默认是auto，值越大越靠上

· 如果属性值相同，按照书写顺序，后来居上

· 数字后面不要加单位

· 只有定位的盒子才有z-index属性

· 定位的拓展

· 绝对定位的盒子居中

· 定位的特殊性

· 添加固定定位和绝对定位的盒子，可以直接设置宽度和高度

· 块元素添加了绝对定位或者固定定位，如果没有宽高，默认就是里面内容的大小

· 脱标的盒子不会触发外边距塌陷的问题

· 脱离标准流的方法：绝对定位、固定定位、浮动。

· 绝对定位和固定定位会完全压住盒子

· 浮动的元素会压住标准流的盒子，但是不会压住盒子中文字和图片

· 绝对定位和固定定位的盒子会完全压住下面的盒子，文字和图片也都会被盖住

· 元素的显示和隐藏

· 类似于网站广告，点击关闭按钮，元素消失，这个时候就需要用到显示和隐藏元素

· display 显示和隐藏（使用频率最高）

· display:none; 代表隐藏对象，不再占有原来的位置

· display:block; 除了能将元素转化为块元素以外，还能将元素显示出来

· visibility 显示和隐藏

· 属性值

· visible 元素可视

· hidden 元素隐藏隐藏之后还会占有原来的位置

· overflow 溢出显示和隐藏

· 属性值

· visible 不剪切也不添加滚动条

· hidden 将超出盒子的内容给隐藏掉

· scroll 不管内容是否超出盒子的范围，都显示滚动条

· auto 盒子中内容超出盒子显示滚动条，不超出不显示

今日遇到的问题：无

解决问题的方案：无

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)