菁英数字科技(猩码)-猩码学苑-专注软件开发人才菁英教育
标题:
前端基础-付盼盼-20230419
[打印本页]
作者:
下潜
时间:
2023-4-20 01:05
标题:
前端基础-付盼盼-20230419
一、学习内容
定位的叠放次序
在使用定位的时候,可能会出现盒子重叠的情况,可以使用z-index属性来控制盒子的前后顺序
属性值
可以是正整数、负整数、或者0, 默认是auto,值越大越靠上
如果属性值相同,按照书写顺序,后来居上
数字后面不要加单位
只有定位的盒子才有z-index属性
定位的拓展
绝对定位的盒子居中
定位的特殊性
添加固定定位和绝对定位的盒子,可以直接设置宽度和高度
块元素添加了绝对定位或者固定定位,如果没有宽高,默认就是里面内容的大小
脱标的盒子不会触发外边距塌陷的问题
脱离标准流的方法:绝对定位、固定定位、浮动。
绝对定位和固定定位会完全压住盒子
浮动的元素会压住标准流的盒子,但是不会压住盒子中文字和图片
绝对定位和固定定位的盒子会完全压住下面的盒子,文字和图片也都会被盖住
元素的显示和隐藏
类似于网站广告,点击关闭按钮,元素消失,这个时候就需要用到显示和隐藏元素
display 显示和隐藏(使用频率最高)
display:none; 代表隐藏对象,不再占有原来的位置
display:block; 除了能将元素转化为块元素以外,还能将元素显示出来
visibility 显示和隐藏
属性值
visible 元素可视
hidden 元素隐藏 隐藏之后还会占有原来的位置
overflow 溢出显示和隐藏
属性值
visible 不剪切也不添加滚动条
hidden 将超出盒子的内容给隐藏掉
scroll 不管内容是否超出盒子的范围,都显示滚动条
auto 盒子中内容超出盒子显示滚动条,不超出不显示
欢迎光临 菁英数字科技(猩码)-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)
Powered by Discuz! X3.4