如何将多个链接放在同一行？

My links unfortunately gets on different lines. I have tried to add display:inline; in my css but it doesen't help at all

不幸的是,我的链接出现在不同的行上。我试图添加display:inline;在我的CSS中,但它根本没有帮助

<h5>
    <a href="start.html" target="search_iframe">Start </a>
    <a href="bildredigering.html" target="search_iframe">Bildredigering</a>
    <a href="start.html" target="search_iframe">Foton</a>
    <a href="start.html" target="search_iframe">Vector </a>
    <a href="start.html" target="search_iframe">Om sidan</a>
</h5>

2 个解决方案

#1

a {
float: left;
}

https://jsfiddle.net/5tzL42aq I hope this will help...

https://jsfiddle.net/5tzL42aq我希望这会有所帮助......

#2

It seems like you're trying to make a menu bar. If that's what you want to do, then you would need to make an unordered list <ul> followed by <li> for every menu you want.

看起来你正在尝试制作菜单栏。如果这是你想要做的,那么你需要为你想要的每个菜单制作一个无序列表

Here is an example:

这是一个例子:

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

li {
    display: inline;
}

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<ul>
  <li><a href="#home">Home</a></li>
  <li><a href="#news">News</a></li>
  <li><a href="#contact">Contact</a></li>
  <li><a href="#about">About</a></li>
</ul>

</body>
</html>

Here is a more in depth tutorial for that: Menu bar tutorial

这是一个更深入的教程:菜单栏教程

You should definitely learn some more HTML and CSS. Here is a link to it: Web Designing tutorial

你一定要学习更多的HTML和CSS。这是一个链接:Web设计教程

Update

Here is a link to jsfiddle.

这是jsfiddle的链接。

#1

a {
float: left;
}