如何让JavaScript菜单垂直显示？

Question

我无法让菜单垂直显示。它只显示水平。我错过了什么？

document.write("<div style='color:blue; font-size:12pt;'>");
document.write('<a href="...">Link 1<\/a> ');
document.write('<a href="...">Link 2<\/a> ');
document.write('<a href="...">Link 3<\/a> ');
document.write('<a href="...">Link 4<\/a> ');
document.write('<a href="...">Link 5<\/a> ');

Answer 1

这应该可以解决问题

document.write("<div style='color:blue; font-size:12pt;'>");
document.write('<a href="...">Link 1</a> <br />');
document.write('<a href="...">Link 2</a> <br />');
document.write('<a href="...">Link 3</a> <br />');
document.write('<a href="...">Link 4</a> <br />');
document.write('<a href="...">Link 5</a> <br />');

编辑：为什么你的</a>喜欢<\/a>？

Answer 2

每个A之后的BR标签与其他推荐的作品一样。您还可以使用内联CSS并将style属性添加到每个A标记（“style ='display：block;'”）。

如果您有一个名为style.css的外部样式表，我个人会使用样式的外部样式表来保持JS清洁。它可能有内容：

#nav { color:blue; font-size:12pt; }
#nav a { display: block; }

然后你可以让你的JS像这样：

document.write('<link href="http://cag.uconn.edu/common/css/screen.css" rel="stylesheet">');
document.write('<div id="nav">');
document.write('<a href="...">Link 1</a> ');
document.write('<a href="...">Link 2</a> ');
document.write('<a href="...">Link 3</a> ');
document.write('<a href="...">Link 4</a> ');
document.write('<a href="...">Link 5</a> ');
document.write('</div>');