vue.js - 如何在任何纵横比下实现相同的外观/设计?
问题描述
我在显示元素时遇到问题,在 1920x1080 分辨率下它看起来很棒,但在其他比例(例如 1366x768)下它变得臃肿。我的目标是在不同的纵横比下具有相同的外观。
PS:我没有使用 vuetify 的字体,因为在我之前的项目中,当我使用 vuetify 字体时,font-size 没有调整大小
解决方案
在每个屏幕尺寸上添加断点,这将确定字体大小和您希望在屏幕上响应的其他元素
前任:
carouselHeight() {
const x = this.$vuetify.breakpoint.name;
//console.log(x)
switch (x) {
case "xl":
return "800";
case "lg":
return "300";
case "md":
return "340";
case "sm":
return "230";
case "xs":
return "150";
default:
return "150";
}
推荐阅读
- python - Selenium 没有返回当前网址
- perl - 为什么启用实验功能时编译指示顺序很重要?
- r - R 中的错误:`[.data.frame`(y.data, , Treat):选择了未定义的列 - 正在运行中介包
- css - 显示一个(不同的div)时全部折叠
- go - Go 有稳定的编译器 API 吗?
- azure - 将 NET-CORE React & DB 发布到 Azure 时未创建表
- c - 将二进制字符串转换为整数
- javascript - Javascript progress bar in React Native
- python - 使用 python 字典和 agraph 在 Graphviz 中标记节点
- java - How to compare single element to any element in a collection or list