instafeed.js返回的居中图像
Center image returned by instafeed.js
Im使用Instafeed.js制作instagram直播。一切都很好,但我想将instafeed返回的图像居中。我试着用了很多不同的方法,但它似乎并不像预期的那样。
我的HTML代码:
<!DOCTYPE html>
<head>
<title>Scenekvelder</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="/instafeed.js"></script>
<script type="text/javascript">
var feed = new Instafeed({
get: "tagged",
tagName: "de3musketereroslo",
clientId: "d07f4ce08c6d4251b9fbb813d1fae305",
resolution: "standard_resolution",
limit: 1,
sortBy: "most-recent"
});
feed.run();
setInterval(function () {location.reload()}, 10000);
</script>
</head>
<body>
<h1>Livefeed fra instagram #De3MusketererOslo</h1>
<main>
<div id="wrapper" class="center">
<div id="insta-wrap">
<div id="instafeed"></div>
</div>
</div>
</main>
</body>
</html>
CSS:
body {
background: #000000;
}
h1 {
color: #FFFFFF;
text-align: center;
padding-top: 2cm;
}
.center {
align-items: center;
}
根据w3schools,"align items"只适用于灵活的元素,我假设您发布的css都是实际的css。因此,做这个
.center {
display: -webkit-flex; /* Safari */
-webkit-align-items: center; /* Safari 7.0+ */
display: flex;
align-items: center;
}
根据布局的其余部分的工作方式,如果instagram提要只是给你img标签,你可能只想做:
.center img {
display: block;
margin-left: auto;
margin-right: auto;
}
相关文章:
- 使用 js 将背景图像设置为 HTML
- 使用图像数组列表的simplegallary.js显示适合桌面屏幕的图像
- 在Node.js中上传和检索图像
- 更改标记.js图像/链接表达式
- 将gif图像添加到chart.js V2.0中
- 使用JS按顺序显示图像,而不是随机显示
- 在向下滚动JS/HTML/CSS wordpress网站时替换徽标图像
- 使用服务器上的HTML/js在网页上显示图像
- 如何在fabric js中向多边形添加图像
- 使用JS滑动或滚动图像
- 需要帮助修复图像JS的动态位置
- 多次更改背景图像JS
- 图像 /JS /css/html 从 Weblogic 9 迁移到 Weblogic 10.3.6 后不会在 chrom
- 无法使用拖放区上传图像.js |导轨 4 和回形针
- 重叠图像JS Slider
- 创建了新图像,但显示的是旧图像JS(AJAX)
- 如何在一次上传多个图像后显示多个图像?JS
- 将iframe放置在图像/JS加载的图像的顶部,现在iframe在图像的下方
- 如何通过Node传输输出的原始图像.JS
- 如何使用预先输入显示图像.js