我遇到了一个问题,我的笔记本电脑和PC的屏幕分辨率相同,都是1920x1080,但在Windows中有一个名为“更改文本、应用和其他项目的大小”的设置在我的电脑上,它被设置为100%,而在笔记本电脑上,它被设置为125%。有没有办法在CSS中设置一个参数,让用户用125%输入时,浏览器将网页缩小25%?我将非常感谢任何帮助。下面是一个测试组件,其中笔记本电脑和PC上的文本大小不同
SCSS:
$sizeImg: 75%;
.test {
@apply w-screen h-screen flex;
.cover {
@apply w-[50%] relative flex justify-end items-center;
&:before {
content: '';
@apply bg-slate-400 absolute;
width: calc(100% - #{$sizeImg} / 2);
height: 100%;
left: 0;
}
}
.text {
@apply w-full bg-slate-600;
}
}
组件:
import React, { useState } from 'react'
import './Test.scss';
import image from '../../assets/images/MainPhoto.png'
function Test() {
return (
<div className='test'>
<div className="cover">
<p>text</p>
</div>
<div className="text"></div>
</div>
)
}
export default Test;