我在网站上托管视频,并创建了Open Graph视频标签,以便在Facebook上共享像example.com/video/my-new-video这样的页面,可以在Facebook新闻源中播放视频,但是没有链接回到example.com/video/my-new-video.
在这种情况下,Open Graph标签如下所示:
<meta property="og:title" content="My New Video" />
<meta property="og:description" content="This is my new video about sharing videos" />
<meta property="fb:app_id" content="xxxxxxxxxxxxx" />
<meta property="og:image" content="http://example.com/video/my-new-video/poster-image.jpg" />
<meta property="og:url" content="http://example.com/video/my-new-video/" />
<meta property="og:type" content="video" />
<meta property="og:video" content="http://example.com/video/my-new-video/video-file.swf" />
<meta property="og:video:secure_url" content="https://example.com/video/my-new-video/video-file.swf" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:width" content="1280" />
<meta property="og:video:height" content="720" />
Run Code Online (Sandbox Code Playgroud)
如果我删除指向SWF播放视频的og:视频网址,我会获得视频的图像和说明,并附带指向example.com/video/my-new-video的链接,但无法在Facebook中播放视频新闻源.
在这种情况下,Open Graph标签如下所示:
<meta property="og:title" content="My New Video" />
<meta property="og:description" content="This is my new video about sharing videos" />
<meta property="fb:app_id" content="xxxxxxxxxxxxx" …Run Code Online (Sandbox Code Playgroud) video facebook opengraph facebook-graph-api facebook-opengraph
我有一个带有一堆自动流动网格项的CSS网格.有时网格项是一个1 x 1轨道,有时它们是2 x 2轨道,所以我不知道源顺序中哪些项目将位于网格中的某些位置.这意味着样式:nth-child()将不可靠.
我想为某些网格列中的项添加样式(主要是最后一列).是否有一个CSS选择器可以让我设置这些项目的样式?
例如,在这个演示中,我如何设置框3,5和9的样式(此处为codepen)?
.grid-container {
display:grid;
grid-template-columns: 1fr 1fr 1fr;
grid-column-gap: 1em;
grid-row-gap: 1em;
}
.grid-item {
background-color: #aea;
text-align:center;
font-size:3em;
min-height:3em;
line-height: 3em;
}
.grid-item.double {
grid-column-start: span 2;
grid-row-start: span 2;
}Run Code Online (Sandbox Code Playgroud)
<body>
<div class="grid-container">
<div class="grid-item">1</div>
<div class="grid-item">2</div>
<div class="grid-item">3</div>
<div class="grid-item">4</div>
<div class="grid-item double">5</div>
<div class="grid-item">6</div>
<div class="grid-item">7</div>
<div class="grid-item">8</div>
<div class="grid-item">9</div>
<div class="grid-item">10</div>
</div>
</body>Run Code Online (Sandbox Code Playgroud)
编辑:代码将以CMS结尾,并可能在将来更改.