同一行设置文字左右对齐,CSS怎么写

发布网友发布时间：2022-04-24 07:22

共5个回答

热心网友时间：2022-04-21 18:25

如果header_top1定义的960px是整个内容的宽度，那么可用以下方式解决——
在CSS样式中增加一项：
.header_top_right {width: 30%（注：这个根据需靠右对齐的文字的宽度设，也可以用px单位）; float: right; text-align: right;}
在页面中：
<div class="header_top1"> <span>欢迎光临某某某网站 </span>
<div class="header_top_right">登录</div>
</div>

希望有帮助。追问按照你的方法操作，文字在背景颜色的下面了！

热心网友时间：2022-04-21 19:43

.header_top1{ width:960px; background:url(../images/topbg.jpg) repeat-x; height:29px; float:left; text-align:right;}

text-align:right;这个代码的意思是让内容右对齐。追问那然后页面中怎么写呢？
是一段文字左对齐，一段文字右对齐啊
左侧文字已经有span了

追答那就用定位吧：
.header_top1{ width:960px; background:url(../images/topbg.jpg) repeat-x; height:29px; float:left;position:relative}
.header_top1 .you{width:100px;height:29px;position:absolute;top:0;right:0;}

欢迎光临某某某网站我是右边的

热心网友时间：2022-04-21 21:18

<html>
<head>
<title>CSS让统一行文字以及输进框对齐</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
#a {
height:30px;
border:1px solid #ccc;
}
#b {
margin-top:20px;
height:30px;
border:1px solid #ccc;
}
#a input {
width:200px;
height:30px;
border:1px solid red;
}
#b input {
width:200px;
height:30px;
border:1px solid red;
vertical-align:middle;
}
</style>
</head>
<body>
<div id="a"><input />Text1</div>
<div id="b"><input />Text2</div>
</body>
</html>

热心网友时间：2022-04-21 23:09

是没有左右对齐的，如果一定要实现那样的，最好是给对象加个以em为单位的宽度。这样就能够实现左右对齐了。

热心网友时间：2022-04-22 01:17

<span style="float:right">欢迎光临某某某网站 </span>