Question

有人可以帮助我做出回应。我正在尝试使其适合平板电脑和手机屏幕。但是我无法使其工作。

.slide-right {
  left: 38%;
  right:50%;
  top: 20%;
  position: absolute;
}
.image-desc {
  width: 750px;
  height: 100px;
  left: 23%;
  right:50%;
  position: absolute;
  top: 45%;
}
.image-desc h3 {
  font-family: 'Josefin Sans', sans-serif;
  font-size: 30px;
  font-weight: 700;
  color: 	#FF0000;
}

<div class="slide-right wow pulse" >
</div>
<div class="image-desc wow fadeInUp">
  <h3> KÖP AV OSS </h3>
 <h3> tel: 07071965063 </h3>
</div>

Answer 1

这是您可以做什么的代码示例。将此代码添加到您的.css文件中：

桌面字体大小

@media screen and (min-width: 1200px) {
  .image-desc h3{ font-size: 30px; }
}

平板电脑和平板手机的字体大小

@media screen and (min-width: 992px) {
   .image-desc h3{ font-size: 20px; }
}

电话字体大小

@media screen and (max-width: 768px) {
   .image-desc h3{ font-size: 15px; }
}

这可以解决您的问题吗？

如何使文本响应？

1 个答案: