Html 根据屏幕自动调整图像

图像未按照屏幕进行调整。请参见图片谷歌游戏徽章\

图像的宽度和高度设置为自动，然后它也不会自动调整大小

我的代码：

正文{
保证金：0；
填充：0；
显示：-网络工具包盒；
显示器：-moz盒；
显示：-ms flexbox；
显示：-webkit flex；
显示器：flex；
证明内容：中心；
对齐项目：居中；
高度：100vh；
背景：#000；
}
p{
位置：相对位置；
字体系列：无衬线；
文本转换：大写；
字号：2em；
字母间距：4px；
颜色：白色；
显示器：flex；
证明内容：中心；
溢出：隐藏；
}
@支持（-webkit文本填充颜色：rgba（45,45,45,05））{
p{
背景：线性梯度（90度，#000，#000fe6，#000）；
背景重复：无重复；
背景大小：80%；
动画：动画3.75秒线性无限；
-webkit背景剪辑：文本；
-webkit文本填充颜色：rgba（45,45,45,05）；
}
}
@关键帧设置动画{
0% {
背景职位：-500%；
}
100% {
背景职位：500%；
}
}
svg{
显示器：flex；
字体：10.5em“蒙特塞拉特”；
保证金：0自动；
}
.文本副本{
填充：无；
笔画：白色；
笔画宽度：5px；
行程偏移：0%；
动画：笔划偏移5.5s无限线性；
}
@支持（笔划阵列：6%29%）{
.文本副本{
中风：6%29%；
}
}
.文本副本：第n个子项（1）{
笔划：4D163D；
动画延迟：-1；
}
.文本副本：第n个子项（2）{
行程：#840037；
动画延迟：-2s；
}
.文本副本：第n个子项（3）{
行程：#BD0034；
动画延迟：-3s；
}
.文本副本：第n个子项（4）{
行程：#BD0034；
动画延迟：-4s；
}
.文本副本：第n个子项（5）{
冲程：#FDB731；
动画延迟：-5s；
}
@关键帧笔划偏移{
100% {
行程偏移：-35%；
}
}
@媒体屏幕和屏幕（最大宽度：600px）{
P
h3，
img{
字体大小：20px；
}
}

标题
这里有一些文字

如果对图像设置

宽度：100%

和

最大宽度：100%

，则会按预期调整大小

正文{
保证金：0；
填充：0；
显示：-网络工具包盒；
显示器：-moz盒；
显示：-ms flexbox；
显示：-webkit flex；
显示器：flex；
证明内容：中心；
对齐项目：居中；
高度：100vh；
背景：#000；
}
.fullWidthImage{
最大宽度：100%；
宽度：100%；
}
p{
位置：相对位置；
字体系列：无衬线；
文本转换：大写；
字号：2em；
字母间距：4px；
颜色：白色；
显示器：flex；
证明内容：中心；
溢出：隐藏；
}
@支持（-webkit文本填充颜色：rgba（45,45,45,05））{
p{
背景：线性梯度（90度，#000，#000fe6，#000）；
背景重复：无重复；
背景大小：80%；
动画：动画3.75秒线性无限；
-webkit背景剪辑：文本；
-webkit文本填充颜色：rgba（45,45,45,05）；
}
}
@关键帧设置动画{
0% {
背景职位：-500%；
}
100% {
背景职位：500%；
}
}
svg{
显示器：flex；
字体：10.5em“蒙特塞拉特”；
保证金：0自动；
}
.文本副本{
填充：无；
笔画：白色；
笔画宽度：5px；
行程偏移：0%；
动画：笔划偏移5.5s无限线性；
}
@支持（笔划阵列：6%29%）{
.文本副本{
中风：6%29%；
}
}
.文本副本：第n个子项（1）{
笔划：4D163D；
动画延迟：-1；
}
.文本副本：第n个子项（2）{
行程：#840037；
动画延迟：-2s；
}
.文本副本：第n个子项（3）{
行程：#BD0034；
动画延迟：-3s；
}
.文本副本：第n个子项（4）{
行程：#BD0034；
动画延迟：-4s；
}
.文本副本：第n个子项（5）{
冲程：#FDB731；
动画延迟：-5s；
}
@关键帧笔划偏移{
100% {
行程偏移：-35%；
}
}
@媒体屏幕和屏幕（最大宽度：600px）{
P
h3，
img{
字体大小：20px；
}
}

标题
这里有一些文字

您还可以帮我更改

SVG

，TITLE.@Pal的大小吗？回答起来并不容易。但是，您需要按比例减少

viewBox

中的最后两个数字。例如，要将

SVG

放大25%，可以使用

viewBox=“0 720 225”

。再看看链接。

 <img src="https://i.imgur.com/me74Rfr.png" alt="google-play-badge" class="width100" />

.width100{
max-width:100%;
width:100%;
}