vh 第14页

js 左右滑动切换图片

:0;box-sizing:border-box;}body{display:flex;align-items:center;justify-content:center;min-height:100vh

青田。·2023-08-05 11:03

css实现毛玻璃效果

然后对剪切的部分使用filter模糊毛玻璃效果制作*{margin:0;padding:0;box-sizing:border-box;}html,body{width:100vw;height:100vh

想要成仙的菜鸟前端·2023-08-05 10:51

【CSS】圆形放大的hover效果

效果index.htmlDocumentindex.cssbody{width:100vw;height:100vh;margin:0;/*弹性盒*/display:flex;/*水平居中*/justify-content

少莫千华·2023-08-04 05:11

【uniapp，触底加载，下拉刷新】【h5】滚动区域滚动触发触底加载 scroll-view

template//主要内容scriptlower(){console.log('触底加载')},css.scrollbox{height:calc(100vh-580rpx);}二，onReachBottom

嘿，小苹果·2023-08-04 00:53

【CSS】3D卡片效果

效果index.htmlDocumentindex.css*{margin:0;padding:0;box-sizing:border-box;}body{width:100vw;height:100vh

少莫千华·2023-08-03 23:34

一条自由游动的鲸鱼

先看效果：再看代码：鲸鱼#canvas-container{width:100%;height:100vh;overflow:hidden;}{"imports":{"three":"https://unpkg.com

timi先生·2023-08-03 12:59

CSS单位详解

vh:1vh=视窗高度的1%。vwvh详解。vmin:vw和vh中较小的那个。vmax:vw和vh中较大的那个。%:相对于包含它的最近的父元素的高度和宽度的百分比。

Knight52033·2023-08-03 11:35

css 利用模糊属性制作水滴

.box{background-color:#111;height:100vh;display:flex;justify-content:center;align-items:center;/*对比度*

crush_yyqx·2023-08-02 18:56

纵向flex布局中高度的问题

flex布局的高度问题且内容自适应flex:1的高度HTML高度不确定css#main{width:220px;height:100vh;border:1pxsolidblack;display:flex

Koreyoshi··2023-08-02 10:01

纯css实现九宫格图片

话不多说，接下来我们直接上代码：Document*{margin:0;padding:0;box-sizing:border-box;}body{height:100vh;display:flex;justify-content

五彩斑斓黑123·2023-08-02 08:22

移动端布局 px em rem vw vh %的区别

px：绝对单位，页面按像素计算，其值固定不变em:相对定位，相对于父节点的值来计算，缺点：相对于父节点的font-size（默认为16px）值来计算，出现层层嵌套问题，计算麻烦rem：相对定位，相当于em的升级版，区别在于rem相对于根元素html来计算，不会出现em的层层嵌套问题，可以作为弹性布局，其浏览器兼容性也比较好；（缺点：1.和根元素的font-size耦合性强，系统字体方法缩小时，会出

諾口壹生·2023-08-02 04:42

【H5移动端】前端H5移动端的单位适配方案集，包括给你用例子讲明白什么是1像素的问题（不定期补充~）

文章目录前置概念视口概念关于像素必要工作：设置理想视口（必须的）方案集@media修改动态rem（不推荐）第三方手淘flexible（不推荐）JS控制rem（不推荐）postcss-px-to-viewport使用自动转换vh

庞囧·2023-08-02 00:28

微信小程序-批量地图标记

已完成{{siteData.ok_huishou_num}}单，{{siteData.ok_shoucang_num}}人已收藏查看更多wxss.mapBox{width:100vw;height:100vh

vanΚon·2023-08-01 23:00

简装picker-view选择年月日

菜狗出没菜狗呀.png今回来点啥呢，上菜制作过程自己创建按一个爱谁谁的组件首先是.acss文件.dialog-datePicker{position:fixed;width:100vw;height:100vh

风飞燕·2023-08-01 17:56

vue大屏数据展示屏幕兼容方案

平时开发中，大屏数据是非常常见的，但屏幕的大小不一样，需要一个兼容性方案首先修改视图的高宽#app{width:100vw;height:100vh;background-color:#020308;overflow

陈大左·2023-08-01 16:56

ant Design vue中a-row 内容不会垂直居中

a-row需要添加一个高度style=“min-height:100vh”哈哈哈哈

OnismYY·2023-07-31 09:12

【CSS】CSS 常用单位

视窗相对单位：vm、vh、vmax、vmin；根据[视窗大小]进行计算。em、remem：相对于元素本身的font-size值。

JS.Huang·2023-07-30 03:23

39.密码长度改变图片模糊

ImagePasswordStrengthChangethepasswordtoseetheeffectEmail:Password:Submitcss部分*{margin:0;padding:0;}body{height:100vh

真让人秃头呀·2023-07-30 03:23

39.手机导航

手机导航html部分css部分*{margin:0;padding:0;}body{background-color:rgb(184,138,203);height:100vh;overflow:hidden

真让人秃头呀·2023-07-30 03:53

36.悬浮板

悬浮板html部分css部分*{margin:0;padding:0;}body{background-color:#111;height:100vh;overflow:hidden;display:flex

真让人秃头呀·2023-07-29 22:21

35.图片幻灯片

:0;padding:0;}body{display:flex;justify-content:center;align-items:center;overflow:hidden;height:100vh

真让人秃头呀·2023-07-29 22:20

CSS方案总结

footer始终在页面底部的固定位置body{display:flex;//父元素设为flex布局flex-flow:column;//设为列布局，否则所有元素会在一行显示min-height:100vh

Scarlett_L·2023-07-29 09:53

uni-app scroll-view事件无法触发的问题

templateimage.pngscroll-view需要给定一个固定高度，如果不确定的话，就先给一个“100vh”，然后监听一下就可以了

逍遥至尊灬寳·2023-07-29 09:55

分享几个水滴效果的按钮

{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1em;min-height:100vh

timi先生·2023-07-29 07:03

CSS通过设置filter实现元素交融效果

Document*{margin:0;padding:0;}body{width:100vw;height:100vh;}.parent{position:relative;filter:contrast

Agwenbi·2023-07-28 10:37

微信小程序，仿微信，下拉显示小程序效果，非常丝滑

微信小程序文档二楼内容一楼内容3.css注意：移动区域一定要大于可移动视图容器，否则将无法移动我这里.area-style设置200vh.view-style设置100vh这里有个细节：当移动区域到最下方时

键盘上行走的猿·2023-07-28 09:24

30.文字自动出现

文字自动出现html部分速度css部分*{margin:0;padding:0;}body{background-color:darksalmon;height:100vh;overflow:hidden

真让人秃头呀·2023-07-28 06:09

26.垂直滚动板

垂直滚动板html部分12341234css部分*{margin:0;padding:0;}body{height:100vh;overflow:hidden;}.slider-container{position

真让人秃头呀·2023-07-28 06:38

32.选择器

padding:0;}body{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh

真让人秃头呀·2023-07-28 06:35

微信小程序18__一个启动动画

109905418·2023-07-27 21:37

react实现自动定位

react接入腾讯地图自动定位自动定位*{margin:0;padding:0;}#app{width:100vw;height:100vh;}.mapWrapper{/*地图(容器)显示大小*/width

HarryDeveloper·2023-07-27 21:45

前端生成批量二维码，并且下载到本地

fix//生成二维码yarnaddhtml2canvas//转图片yarnaddjszip//压缩包yarnaddfile-saver//下载index.scss#HomePage{height:100vh

进击的王十二·2023-07-27 14:04

【CSS】 vh、rem 和 px 的区别

vh、rem和px都是CSS中常见的长度单位，它们有以下区别：px（像素）是一个绝对单位，表示屏幕上的实际像素点。它的大小不会根据设备或浏览器的设置进行调整，是一个固定值。

谢尔登·2023-07-27 13:14

【转载】11种垂直居中的方法

垂直居中的正确打开方式image.png这是垂直居中的元素居中元素宽高已知1.absolute+marginauto.parent{position:relative;width:90vw;height:90vh

优秀的收藏转载分享·2023-07-27 00:55

用html加css画个新拟态键盘

background-color:#f1f1f7;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh

背着行囊去远方·2023-07-26 21:07

rem移动适配解决方案及flexible.js插件使用

企业常用移动适配解决方案：即实现在不同宽度的设备中，网页元素尺寸等比缩放效果rem：目前多数企业在用的解决方案vw/vh：未来的解决方案及趋势本文将阐述rem适配方法rem单位Ø相对单位Ørem单位是相对于

黄马小配件·2023-07-26 03:56

指定区域拖拽

Documentbody{width:100%;height:100vh;display:flex;}#box{width:500px;height:500px;background-color:aquamarine

真是个非常帅气的昵称呢·2023-07-26 01:36

H5兼容性问题汇总

iosiphoneX系列底部被遮挡或跟随滚动条滑动（底部黑条）解决方案.EmployerContainer{height:100vh;.indexContent{overflow-y:scroll;height

小张很嚣张～·2023-07-25 19:14

web one item === 100vh

1.Makeafuncode在线体验：https://codepen.io/zhu-hongwei/pen/ExOyKLx2.ShowmethecodeDocumentTitle1234body,ul,li{margin:0;padding:0;}li:nth-of-type(odd){background-color:#f5f6f7;}.title{position:sticky;top:0;l

__只是为了好玩__·2023-07-25 15:35

微信小程序遮罩层 demo

上代码搜索取消.mask{background-color:rgb(0,0,0,.9);position:fixed;top:55px;left:0;width:100%;height:100vh;}Page

__只是为了好玩__·2023-07-25 15:04

23.动态加载

padding:0;}body{background-color:#2c3e50;display:flex;align-items:center;justify-content:center;height:100vh

真让人秃头呀·2023-07-24 23:26

24.骨架屏

padding:0;}body{background-color:#ecf0f1;display:flex;align-items:center;justify-content:center;height:100vh

真让人秃头呀·2023-07-24 23:26

11.键盘事件

部分请按下你的键盘css部分*{margin:0;padding:0;}body{display:flex;justify-content:center;align-items:center;height:100vh

真让人秃头呀·2023-07-24 23:56

微信小程序瀑布流组件

1.创建文件夹/components/waterfall/文件夹结构如图各文件内容：.wxml.wxss.waterfallView{width:100vw;height:100vh;padding:2%

某公司摸鱼前端·2023-07-24 22:29

20.按钮事件

按钮事件html部分Clickmecss部分*{margin:0;padding:0;}body{display:flex;height:100vh;justify-content:center;align-items

真让人秃头呀·2023-07-24 18:55

21.拖拽事件

拖拽事件html部分css部分*{margin:0;padding:0;}body{display:flex;height:100vh;justify-content:center;align-items