让元素沾满全屏

简介: 让元素沾满全屏

让元素沾满全屏有两种方法

       1:给盒子设置position绝对定位 然后让left top bottom right都为0

14736e1d3d1547f39b0351d73dea8a61.png

这里设置line-height 100vh 是为了让内容水平居中和垂直居中

81cc6db7e9044c139f691cf182cc3e0c.png

还有一种是 先需要将body的margin默认值设置为0 然后再通过设置vh和vw为100来设置宽高来实现

fb32cb23b92d40cb83a29ff402caf64b.png

1ce6f43717754cb0a940628e1fb9fb06.png

相关文章
|
6月前
【实现手机端上滑滚动加载列表】判断页面是否滚动到底部或者指定元素位置
【实现手机端上滑滚动加载列表】判断页面是否滚动到底部或者指定元素位置
|
3月前
Framer 滚动动画效果集合 (讲解)
Framer 滚动动画效果集合 (讲解)
49 0
|
4月前
screenfull全屏、退出全屏、指定元素全屏的使用步骤
screenfull全屏、退出全屏、指定元素全屏的使用步骤
271 5
|
4月前
|
JavaScript
vue 全屏 screenfull —— 整页全屏,指定元素全屏,退出全屏,全屏切换等
vue 全屏 screenfull —— 整页全屏,指定元素全屏,退出全屏,全屏切换等
410 0
|
4月前
|
前端开发 JavaScript
js 进入浏览器全屏(F11效果)、退出全屏、指定元素全屏、判断当前是否全屏、监听浏览器全屏事件、定义全屏时的css样式(全屏伪类)
js 进入浏览器全屏(F11效果)、退出全屏、指定元素全屏、判断当前是否全屏、监听浏览器全屏事件、定义全屏时的css样式(全屏伪类)
548 0
|
4月前
|
JavaScript
vue 监听滚动条行为 | 判断滚动条是向上滚动还是向下滚动
vue 监听滚动条行为 | 判断滚动条是向上滚动还是向下滚动
169 0
|
5月前
|
Web App开发 前端开发 JavaScript
如何隐藏一个元素的滚动条
如何隐藏一个元素的滚动条
162 0
|
6月前
|
前端开发
css样式实现一个滑动按钮
css样式实现一个滑动按钮
52 0
|
6月前
|
JavaScript
selenium元素等待及滚动条滚动
selenium元素等待及滚动条滚动
68 2
|
11月前
|
前端开发
HTML+CSS实现菜单的3D翻转特效
HTML+CSS实现菜单的3D翻转特效