Google AJAX Feed APIについて

質問

ブログのRSSを使って自動的にホームページに新着ブログ記事の日付とタイトルを表示されるようにしたいと思い、Google AJAX Feed APIを使用しました。

下記のソースだとこのように表示されます。
・タイトル(2009年6月22日)
・タイトル(2009年6月20日)

表示方法をもう少し変えたいんですが、文字サイズと行間の変更はどのようにすれば可能か、ご存知の方は教えて下さい。

1.文字サイズをもう少し小さく(10pxに)したい
2.行間がくっ付いているのでもう少し広くしたい

<script type="text/javascript" src="http://www.google.com/jsapi?key=APIキー"></script>
<script type="text/javascript">

google.load("feeds", "1");

function initialize() {
var feed = new google.feeds.Feed("フィードのアドレス");
feed.setNumEntries(10);
feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var div = document.createElement("li");
var a = document.createElement("a");
a.href = entry.link;
a.target = "_top" ;
var date = new Date(entry.publishedDate);
a.appendChild(document.createTextNode(entry.title + " (" + date.toLocaleDateString() + ")" ));
div.appendChild(a);
container.appendChild(div);
}
}
});
}
google.setOnLoadCallback(initialize);

</script>
<div id="feed"></div>

回答No.1

noname#87714 · ベストアンサー

スクリプトタグの上あたりに以下を記述。

<style type="text/css">
#feed {
font-size:10px;
}
#feed li {
height: 2em;
}
</style>

このぐらいなら FeedControl を使うほうがラクですけど。

<script type="text/javascript" src="http://www.google.com/jsapi?key=********"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize(){
var feedControl = new google.feeds.FeedControl();
feedControl.addFeed("URL", "");
feedControl.draw(document.getElementById("feed"));
}
google.setOnLoadCallback(initialize);
</script>

無駄な部分は CSS で消せますし。