如何为instagram应用内浏览器调整html / css布局？ [英] How to adjust html/css layout for instagram in-app browser?

问题描述

我一直在搜索很多东西，但是找不到解决我问题的线索。我有一个小型网站（仅html / css），在移动Chrome上看起来不错。但是在Android 5.0上的instagram应用内浏览器中，填充出现问题。有什么方法可以通过媒体查询或前缀处理应用内浏览器？到目前为止，我什么都没找到。希望这里有人可以帮助我。提前致谢。

I've been googling a lot, but found no clue for my problem. I have a tiny website (html/css only), that's looks nice on mobile Chrome. But on instagram in-app browser on Android 5.0 somethings goes wrong with paddings. Is there any way to deal with in-app browsers through media-queries or prefixes? So far I've found just nothing. Hope here someone could help me. Thanks in advance.

P.S。对不起，我的英语不好，我正在努力。

P.S. Sorry for my poor English, I am working on it.

推荐答案

您可以使用JavaScript检测包括 Instagram ，并为此请求特定的CSS。

You can use JavaScript to detect the user-agent which includes Instagram and request a specific CSS for that case.

示例代码：

<script>
var isInstagram = navigator.userAgent.match(/instagram/i);
if (isInstagram) {
  var head = document.querySelector('head');
  var link = document.createElement('link');
  link.rel = 'stylesheet';
  link.href = 'your-file-with-instagram-fixes.css';
  head.appendChild(link);
}
</script>

这篇关于如何为instagram应用内浏览器调整html / css布局？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！