css - 如何在手机中隐藏箭头

Question

请检查：https ://iconsmgmt.com/project/miguel-ferrero/

如果您在移动版本中看到，箭头固定在图像上。箭头如何仅在光标在照片中时出现，就像桌面版本一样。我使用wordpress/divi。

CSS 专家可以帮助我。谢谢。

标签： csswordpressgallery

Answer 1

在移动版本中为了更好的用户体验，箭头应该默认出现。但是如果你想让箭头表现得像桌面，你应该这样做：在你有这些代码的 css 文件中，你应该从它们中省略“opacity:1”。

@media all and (max-width:767px) {
   .et_mobile_device .et-pb-arrow-prev {
       left: 0;
       opacity:1; // omit this line
   }
   .et_mobile_device .et-pb-arrow-next {
        right: 0;
        opacity: 1; // omit this line
   }
}

和这个：

.et_mobile_device .et-pb-arrow-prev {
    left: 22px;
    opacity:1; // omit this line
}

.et_mobile_device .et-pb-arrow-next {
    right: 22px;
    opacity: 1; // omit this line
}