Question

使用以下twitter嵌入方法（https://dev.twitter.com/web/embedded-timelines）专门使用网格布局，有没有办法控制背景颜色？

我想要更新的风格是在一个类＆＃34; GridLayoutTextOnlyTweet＆＃34;但这是在iFrame中。

Answer 1

如果您使用https://publish.twitter.com中嵌入的新Twitter，则只需添加data-chrome="transparent"即可使背景透明，那么您只需设置一个具有背景颜色的包装元素即可。

到代码块

<a class="twitter-timeline" data-dnt="true" data-chrome="transparent" data-link-color="#ffcc00" href="https://twitter.com/StackOverflow">Tweets by StackOverflow</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

其他可用选项为：

data-chrome="transparent nofooter noborders noheader noscrollbar"

文档：

https://developer.twitter.com/en/docs/twitter-for-websites/timelines/overview

Answer 2

很好的答案，但后来我做到了，黑暗的主题立即为我工作

data-theme="dark"

查看此链接以获取参考 https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/guides/embedded-tweet-parameter-reference

Answer 3

你可以这样做：

.GridLayoutTextOnlyTweet {
  background: red;
}

它在iframe中并不重要。您可能需要添加!important来覆盖默认样式，但请先尝试。

Answer 4

a.twitter-timeline {
  /* Buttonish */
  display: inline-block;
  padding: 6px 12px 6px 30px;
  margin: 10px 0;
  border: #ccc solid 1px;
  border-radius: 3px;
  background: #f8f8f8 url("") 8px 8px no-repeat;
  background-size: 1em 1em;

  /* Text */
  font: normal 12px/18px Helvetica, Arial, sans-serif;
  color: #333;
  white-space: nowrap;
}

参考：https://dev.twitter.com/web/overview/css

Twitter嵌入式时间线背景颜色

4 个答案: