Question

我需要你们的帮助。目前，我正在从头开始建立一个网站，客户希望将他的Twitter提要添加到网站的页脚。

但问题是我无法自定义默认的Twitter Feed样式。这是屏幕截图，请看一下https://i.imgur.com/Gv28Ky1.png

请帮我按CSS自定义Twitter Feed。

亲切的问候阿萨德

Answer 1

我是相对新手，但我使用以下javascript函数并在<body>元素中调用它取得了一些成功。因为Twitter通过脚本获取其样式，所以它会呈现最后一次，因此css表中的任何样式都将被否决。修复是使用脚本直接覆盖嵌入的twitter样式表。

试试这个：

将以下脚本插入您网站的标题：

<script>
  var widgetCSS = "" +
    "#twitter-widget-0{width: 100% !important;}"+
    ".timeline-Tweet-text{color:red; font-size:20px !important;}" +
    ".timeline-Widget{background-color: red;" +
    ".TweetAuthor-name{color:white !important;}";

  function customTwitter(){
    var w = document.getElementById("twitter-widget-0").contentDocument;

    var s = document.createElement("style");
    s.innerHTML = widgetCSS;
    s.type = "text/css";
    w.head.appendChild(s);
  }
</script>

将var widgetCSS的值更改为您希望CSS看起来的样子。我使用chrome上的inspect功能来识别需要更改的类。
最后，调用函数paint（）;在html的主体中如此：
```
<body onload="customTwitter();">
```

...您应该看到受影响元素的更改。

希望这有帮助。

如何自定义嵌入式Twitter Feed CSS

1 个答案: