Как мне заставить меню JavaScript отображаться вертикально?

#javascript #menu

#javascript #меню

Вопрос:

Я не могу заставить меню отображаться вертикально. Оно отображается только горизонтально. Чего мне не хватает?

 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> ');

1. Вы могли бы добавить <br> после каждой ссылки

2. Новые строки, вероятно. <br> если у вас нет никакого предварительного форматирования.

3. css.maxdesign.com.au/listamatic

4. Почему вы убегаете / ? не имеет смысла

Ответ №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> ??

1. Спасибо, Сэм! Это сработало! Я использовал обратную косую черту в теге link end, потому что традиционно она использовалась для того, чтобы JS не думал, что косая черта завершает строку.

Ответ №2:

Тег BR после каждого A, как рекомендовано другими, работает. Вы также можете использовать встроенный CSS и добавить атрибут стиля к каждому тегу A (» style=’display: block;'»).

Лично я бы использовал внешнюю таблицу стилей для styles, чтобы поддерживать чистоту JS, если бы у вас была внешняя таблица стилей с именем style.css. В нем может быть содержимое:

 #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>');

1. Привет, НиХа, это именно то, что я в итоге сделал. У меня уже был внешний файл CSS, поэтому я добавил атрибуты стиля. Я согласен, мне больше нравится более чистый код, даже если этот наш сайт безумно прост.