logo标签列表

如何在标题右侧使用CSS定位文本链接

css
3
我想要的是在左边有一个加粗的标题，右边有一个普通大小和字体的文本链接。问题在于我无法只将链接放在标题旁边，经常会出现其他文本或者链接在标题下方而不是旁边。
测试
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="my.css">
</head>
<body>
<div class="main">
<div class="swtitle">
<h1 class="swTitle">Title</h1> <a class="downloadXYZ" href="download.zip">Download</a>
text i dont want. I cant figure out what to write here.
</div>
</div>

</body>
</html>
你能添加你正在使用的CSS吗？ - CodeLikeBeaker
断行标签真的很不好吗？ - peirix
3个回答
5

您应该使用style="display:inline"，这将有助于您将文本包裹在您正在处理的内容（如图像）周围。

<h1 class="swTitle" style="display:inline;">Title</h1>

如果您喜欢，也可以使用浮动（float），但是内联（inline）更好。

1
我更喜欢使用 inline-block，这样就不会失去边距/填充。 - outofmind
2
我不是CSS专家，但你可以尝试在标题标签上使用以下代码（注意“display:inline”）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title></title>
        <link rel="stylesheet" type="text/css" href="my.css">
    </head>
    <body>
        <div class="main">
            <div class="swtitle">
                <h1 class="swTitle" style="display:inline;">Title</h1> 
                <a class="downloadXYZ" href="download.zip">Download</a>text i dont want. I cant figure out what to write here.
            </div>
        </div>
    </body>
</html>

希望这可以帮到您！
0

如果你没有提供你正在使用的CSS示例，我会尝试以下方法来帮助你入门：

<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="my.css">
</head>
<body>
    <div>
        <div style="float: left;">
            <h1>
                Title</h1>
        </div>
        <div style="float: right;">
            <a class="downloadXYZ" href="download.zip">Download</a>text i dont want. I cant
            figure out what to write here.
        </div>
    </div>
</body>
</html>
你说的“没有CSS”是什么意思？float: left就是CSS。你真的试过吗？ - Roland
@Roland，我明白为什么我这么说了。他没有提供CSS（被要求的），所以我这样说：“在没有提供CSS的情况下，试试这个”。更新了答案。感谢指出。 - CodeLikeBeaker
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接