No.2.6
vw/vh:(能够使用vw单位设置网页元素的尺寸)
相对单位 相对视口的尺寸计算结果 vw:viewport width(1vw=1/100视口宽度) vh:viewport height(1vh=1/100视口高度)
vw适配原理:(实现在不同宽度的设备中,网页元素尺寸等比缩放效果)
vw单位尺寸:
1.确定设计稿对应的vw尺寸(1/100视口宽度) 查看设计稿宽度 > 确定参考设备宽度(视口宽度)> 确定vw尺寸(1/100视口宽度)
2.vw单位的尺寸 = px单位数值 /(1/100视口宽度)
视频布局:父级左右padding 每个视频盒子 宽度为50% 左右padding(拉开内容的距离)
/* 弹性盒子换行 */ flex-wrap: wrap;
随机推荐
- 使用WPF或AspNetCore创建简易版ChatGPT客户端,让ChatGPT成为你的私人助理
前言:前一天写的一个ChatGPT服务端,貌似大家用起来还不是那么方便,所以我顺便用WPF和AspNetCore的webapi程序做个客户端吧,通过客户端来快速访问chatgpt模型生成对话. 1 ...
- 小程序与app区别及测试点
小程序和app区别 1. 用户获取渠道区别 小程序: 二维码.用户分享推荐.搜索小程序 APP: 需要去应用市场(或其他)下载 2. 下载.安装卸载 小程序: 不需下载安装,清除时直接删除小程序 AP ...
- vulnhub靶场之GROTESQUE: 3.0.1
准备: 攻击机:虚拟机kali.本机win10. 靶机:Grotesque: 3.0.1,下载地址:https://download.vulnhub.com/grotesque/grotesque3. ...
- 洛谷P2196例题分析
[NOIP1996 提高组] 挖地雷(原题) 题目描述 在一个地图上有\(N\)个地窖\((N \le 20)\),每个地窖中埋有一定数量的地雷.同时,给出地窖之间的连接路径.当地窖及其连接的数据给出 ...
- 把ChatGPT配置到微信群里,可以对AI提问了!
作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 一.前言:用的很爽! 自从小傅哥用上 ChatGPT 连搜索引擎用的都不多了,很多问题的检索我 ...
- MongoDB从入门到实战之MongoDB工作常用操作命令
前言: 上一章节我们快速的在Docker容器中安装了MongoDB,并且通过Navicat MongoDB可视化管理工具快速的连接.创建数据库.集合以及添加了文档数据源.这一章节我们主要是了解一下在日 ...
- [编程基础] C++多线程入门7-条件变量介绍
原始C++标准仅支持单线程编程.新的C++标准(称为C++11或C++0x)于2011年发布.在C++11中,引入了新的线程库.因此运行本文程序需要C++至少符合C++11标准. 文章目录 7 条件变 ...
- RocketMQ Compaction Topic的设计与实现
本文作者:刘涛,阿里云智能技术专家. 01 Compaction Topic介绍 一般来说,消息队列提供的数据过期机制有如下几种,比如有基于时间的过期机制--数据保存多长时间后即进行清理,也有基于数据 ...
- 刷题笔记——3003.鸡兔同笼问题 & 2767.计算多项式的值
题目1 3003.鸡兔同笼问题 代码 while True: try: x,y=map(int,input().strip().split()) a = int((4*x-y) / 2) b = x ...
- 图文并茂解决Client does not support authentication protocol requested by server; consider upgrading MySQL
今天服务器部署node.js+mysql,调用接口报错ER_NOT_SUPPORTED_AUTH_MODE: Client does not support authentication protoc ...