让元素沾满全屏

简介: 让元素沾满全屏

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

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

14736e1d3d1547f39b0351d73dea8a61.png

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

81cc6db7e9044c139f691cf182cc3e0c.png

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

fb32cb23b92d40cb83a29ff402caf64b.png

1ce6f43717754cb0a940628e1fb9fb06.png

相关文章
|
7月前
【实现手机端上滑滚动加载列表】判断页面是否滚动到底部或者指定元素位置
【实现手机端上滑滚动加载列表】判断页面是否滚动到底部或者指定元素位置
|
5月前
screenfull全屏、退出全屏、指定元素全屏的使用步骤
screenfull全屏、退出全屏、指定元素全屏的使用步骤
335 5
|
4月前
Framer 滚动动画效果集合 (讲解)
Framer 滚动动画效果集合 (讲解)
58 0
|
5月前
|
JavaScript
vue 全屏 screenfull —— 整页全屏,指定元素全屏,退出全屏,全屏切换等
vue 全屏 screenfull —— 整页全屏,指定元素全屏,退出全屏,全屏切换等
516 0
|
5月前
|
前端开发 JavaScript
js 进入浏览器全屏(F11效果)、退出全屏、指定元素全屏、判断当前是否全屏、监听浏览器全屏事件、定义全屏时的css样式(全屏伪类)
js 进入浏览器全屏(F11效果)、退出全屏、指定元素全屏、判断当前是否全屏、监听浏览器全屏事件、定义全屏时的css样式(全屏伪类)
615 0
|
6月前
|
Web App开发 前端开发 JavaScript
如何隐藏一个元素的滚动条
如何隐藏一个元素的滚动条
170 0
|
7月前
|
iOS开发
ios中,输入框获得焦点时,页面输入框被遮盖,定位的元素位置错乱
ios中,输入框获得焦点时,页面输入框被遮盖,定位的元素位置错乱
89 1
全屏了却判断为未全屏(已解决)
全屏了却判断为未全屏(已解决)
|
前端开发 JavaScript 计算机视觉
css动画:文字向上移动并逐渐消失 点击按钮显示+1上移淡出
css动画:文字向上移动并逐渐消失 点击按钮显示+1上移淡出
1113 0
css动画:文字向上移动并逐渐消失 点击按钮显示+1上移淡出
|
前端开发
鼠标经过时反转遮罩层
当鼠标移入指定的元素时,图片会旋转到遮罩层,然后显示相关介绍内容。
115 0
鼠标经过时反转遮罩层