Html CSS 新手：如何将我的链接与页面右侧对齐？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6184742/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS newbie: How to align my link to the right side of the page?
提问by Leem
I have a link on my index page:
我的索引页上有一个链接：
<div class="content">
<a class="buy" href="buy.html">Buy</a>
</div>
I would like to align it to the right side of my page, I tried:
我想将它与我页面的右侧对齐，我尝试过：
a.buy{
color: #2da1c1;
font-size: small;
text-decoration: none;
left: 252px;
float: left;
}
a.buy:hover
{
color: #f90;
text-decoration: underline;
left: 252px;
float: left;
}
But it still located on the left side. (I have included my CSS file in my index.html, and the CSS file already take effect for other elements on the page)
但它仍然位于左侧。（我已经在我的 index.html 中包含了我的 CSS 文件，并且该 CSS 文件已经对页面上的其他元素生效）
回答by thirtydot
Try float: right:
尝试float: right：
a.buy {
color: #2da1c1;
font-size: small;
text-decoration: none;
float: right;
}
a.buy:hover
{
color: #f90;
text-decoration: underline;
}
Another way would be:
另一种方法是：
.content {
position: relative
}
a.buy {
color: #2da1c1;
font-size: small;
text-decoration: none;
position: absolute;
right: 0;
}
a.buy:hover
{
color: #f90;
text-decoration: underline;
}
回答by RRStoyanov
(1) you have float: left;on the example code
(2) maybe if you add float: right;to the div it will help?
(1) 你有float: left;示例代码 (2) 也许如果你添加float: right;到 div 它会有所帮助吗？
回答by Yule
Try the following:
请尝试以下操作：
a.buy{
color: #2da1c1;
font-size: small;
text-decoration: none;
float: right;
}
a.buy:hover
{
color: #f90;
text-decoration: underline;
}
回答by Budimir Grom
You may also try:
您也可以尝试：
.content
{
text-align: right;
}
