Я хочу, чтобы ссылка html и элемент <form>появлялись в одной строке

Question

Это мой HTML-код:

<img src="http://127.0.0.1/bookManagementProject/asset/images/mainLogo.gif"><a>

<br> <FONT SIZE=3 FACE="Arial"><br>&nbsp&nbsp&nbsp 
<a href = "http://127.0.0.1/home.html" <b>Home<a> |
<a href = "http://127.0.0.1/login.do" <b>Login</a> | <form method="get" action= http://flyingame.gamehost.org:8080/search.do> Search: <input type="text" name=searchTermFromBanner> <input type="submit" value=Search></FONT></br>  

Проблема в том, что элемент <form> не отображается в одной строке с "Home" и "Login"

кстати, это HTML-код баннера

Answer 1

Самый простой способ - поместить ссылку внутри формы:

<form method="get" action="http://flyingame.gamehost.org:8080/search.do">
    <font size="3" face="Arial">
        <br>&nbsp;&nbsp;&nbsp; 
        <a href="http://127.0.0.1/home.html" <b>Home</b><a> 
        |
        <a href = "http://127.0.0.1/login.do" <b>Login</a> 
        |
        Search: 
        <input type="text" name="searchTermFromBanner" /> 
        <input type="submit" value="Search" />
    </font>
</form>

Вы, вероятно, должны немного очистить свой HTML (<font> заменяется CSS уже несколько лет). Также укажите свои атрибуты и следите за отсутствующими точками с запятой в ваших сущностях.

Answer 2

НЕ СЛЕДУЕТ это делать, но вы можете это исправить, просто назначив display: inline для формы

<form method="get"  style="display:inline;"  action="http://flyingame.gamehost.org:8080/search.do"> Search: <input type="text" name="searchTermFromBanner"> </form>

он должен быть в отдельном файле CSS, а не в теге "style".

Answer 3

Как сказали Гарет Симпсон и Грег, самый простой способ - обернуть ссылки в теге, но, СЕРЬЕЗНО, вам не следует использовать тег, а также тот факт, что браузеры отображают без атрибута alt и незакрытые , не означает, что вы должны это делать.

Я согласен с idrumgood, было бы здорово, если бы вы могли проверить www.w3schools.com, для вашего же блага.

Приветствия

Answer 4

Есть много способов сделать это, но самый простой - просто расширить форму, включив в нее другие ссылки:

<img src="http://127.0.0.1/bookManagementProject/asset/images/mainLogo.gif">
<br> <form method="get" action= http://flyingame.gamehost.org:8080/search.do><FONT SIZE="3" FACE="Arial"><br>&nbsp&nbsp&nbsp 
<a href = "http://127.0.0.1/home.html" <b>Home</b><a> |
<a href = "http://127.0.0.1/login.do" <b>Login</b></a> | 
 Search: <input type="text" name="searchTermFromBanner"> <input type="submit" value="Search"></FONT></form>

В общем случае вы закрываете <br> теги, которые вы не можете, и не закрываете теги, которые вы должны. Также у вас есть совершенно ошибочный тег <a> в первой строке.

Если мы становимся очень разборчивыми, то использование тега шрифта не было лучшей практикой в ​​течение некоторого времени. Вы должны смотреть на CSS.

Answer 5

В вашем CSS:

form#the-form-id {
    display: inline-block;
}