2010-12-07 47 views
1

我使用嵌入代碼在我的網站上嵌入了一個twitter小部件。但是在把它放在我的網頁上後,字母太大而且大小都是錯的。字母太大,小部件的造型不成比例。Twitter Widget被css扭曲。我該如何解決它

所需的所有樣式信息實際上都在JavaScript代碼中。但它看起來像是壓倒了造型並拋棄了它。

這裏是小部件的代碼。

<script src="http://widgets.twimg.com/j/2/widget.js"></script> 
<script> 
new TWTR.Widget({ 
    version: 2, 
    type: 'profile', 
    rpp: 4, 
    interval: 6000, 
    width: 160, 
    height: 300, 
    theme: { 
    shell: { 
     background: '#333333', 
     color: '#ffffff' 
    }, 
    tweets: { 
     background: '#000000', 
     color: '#b68e59', 
     links: '#cccccc' 
    } 
    }, 
    features: { 
    scrollbar: false, 
    loop: false, 
    live: false, 
    hashtags: true, 
    timestamp: true, 
    avatars: false, 
    behavior: 'all' 
    } 
}).render().setUser('BigNotch').start(); 
</script> 

這裏是鏈接到它的頁面。 http://notchtheguru.com

我該如何解決這個問題?

回答

0

JavaScript文件包含影響您的小部件樣式的CSS。

我建議保存您自己的小部件副本並將其存儲在您的網絡服務器上,以便您可以編輯它的內容。

字體大小就要到了18/20像素,所以如果你發現下面的類和減小字體大小應該看起來更像是你所追求的 - 這樣的事情:

.twtr-tweet-wrap { 
    font-size: 14px; // Or whatever size you choose... 
} 
+0

有沒有辦法來隔離代碼或什麼的。即使當我改變字體,小部件的整個風格也會搞砸。 – 2010-12-07 07:48:27

1

我想通它出來了,所以現在我要回答我自己的問題:)(也許某人esle會遇到這個問題)

我所做的是把小部件放在一個容器div。我在containter div上設置了字體,但是您根本不必爲容器潛水設置任何內容。

相關問題