Twitter 嵌入 - 如何覆盖 CSS

Question

我正在尝试覆盖嵌入的推文 CSS。我首先尝试使用常规 CSS 但推文不理解它并且似乎不起作用：https://dev.twitter.com/web/overview/css

我现在正在尝试 javascript 方法，但我无法设法定位推文中的元素。我一直在寻找答案，但它们都是关于 Twitter 时间线的，而不是单个嵌入式推文。

我正在使用 https://dev.twitter.com/web/javascript/events :

twttr.ready( function(twttr){

twttr.events.bind('rendered',function (event) {

var tgt = event.target;  // Now inside each tweet
// Code to target the content in order to change its css
});

感谢您的帮助。

编辑//这是工作脚本：

twttr.ready( function(twttr){

twttr.events.bind('rendered',function (event) { 

    var tgt = event.target;

    $(tgt).contents().find(".EmbeddedTweet").css({  
        "border":"2px solid black",
        "border-radius":"7px",
        "max-width":"100%"
    });

  });

});

Answer 1

我找到了答案，这里是如何为加载的推文动态设置样式：

twttr.ready( function(twttr){

twttr.events.bind('rendered',function (event) { 

var tgt = event.target;

$(tgt).contents().find(".EmbeddedTweet").css({  
    "border":"2px solid black",
    "border-radius":"7px",
    "max-width":"100%"
   });

 });

});

Answer 2

以下代码对我有用 -

twttr.ready(function(twttr) {
  twttr.events.bind("rendered", function(event) {
    var tgt = event.target;
    $(tgt.shadowRoot)
      .find(".EmbeddedTweet")
      .css({
        "max-width": "100%"
      });
  });
});

Twitter 嵌入 - 如何覆盖 CSS

Twitter embed - How to override CSS

javascript

css

embed

twitter