例如,我想要以下格式
Nov/1 2013
This is a sunny day
Nov/12 2013
A friend visits my home
...
日期行已right
对齐,而内容行已left
对齐。
我试过<div>
,它在两行之间增加了额外的空间。
答案 0 :(得分:2)
此
<div id="box">
<p class="text-right">Nov/1 2013</p>
<p class="text-left">This is a sunny day</p>
<div style="clear: both"></div>
</div>
和
#box{
width: 150px;
border: 1px solid;
}
.text-left{
float: left;
}
.text-right{
float: right;
}
p{
margin:0;
padding:0;
}
应该做的伎俩!
答案 1 :(得分:2)
请参阅 JSFIDDLE
这就是你要找的东西吗?
<强> HTML 强>
<p class="paragraph">
<span class="right-aligned">Nov 13</span>
This is a sunny day
</p>
<强> CSS 强>
.paragraph {
display: inline-block;
}
.right-aligned {
display: block;
text-align: right;
width: 100%;
}
可以选择在此解决方案中定义段落的宽度。
答案 2 :(得分:0)
尝试这个,
的jsfiddle:http://jsfiddle.net/RaLwc/1/
<div class="cont">
<span class="right">Nov/1 2013</span>
<span class="left">This is a sunny day</span>
<span class="right">Nov/12 2013</span>
<span class="left">A friend visits my home</span>
</div>
.cont
{
width:145px;
height:auto;
float:left;
}
.cont span
{
width:100%;
height:auto;
float:left;
}
.right{
text-align:right;
}
.left{
text-align:left;
}
答案 3 :(得分:-1)
<div align="right">Nov/1 2013<br/>
This is a sunny day
</div>
产地:
2013年11月1日