我该如何将文字左alignment,文字右alignment?

如何alignment文本,使其中的一部分与左边alignment,而其中的一部分与同一行内的右边alignment?

<p>This text should be left-aligned. This text should be right aligned.</p> 

我可以将所有文本alignment到左侧(或右侧),直接内联,或使用样式表 –

 <p style='text-align: left'>This text should be left-aligned. This text should be right aligned.</p> 

如何将相应的文本左右alignment,同时保持同一行?

  • 只有圆桌angularCSS
  • Chrome扩展程序:如何在新标签页中打开链接?
  • 我如何使用Mechanize来处理JavaScript?
  • Python代码从string中删除HTML标签
  • 使用正则expression式和JavaScript在html中突出显示单词 - 几乎在那里
  • 为什么z-index不起作用?
  • <strong> vs <em>?
  • 如何删除iPhone / iOS上蓝色的电话号码样式?
  • 8 Solutions collect form web for “我该如何将文字左alignment,文字右alignment?”

     <p style="text-align:left;"> This text is left aligned <span style="float:right;">This text is right aligned</span> </p> 

    HTML:

     <span class="right">Right aligned</span><span class="left">Left aligned</span>​ 

    CSS:

     .right{ float:right; } .left{ float:left; } 

    演示:
    http://jsfiddle.net/W3Pxv/1

     <h1> left <span> right </span></h1> 

    CSS:

     h1{text-align:left; width:400px; text-decoration:underline;} span{float:right; text-decoration:underline;} 

    如果您不想使用浮动元素,并且要确保两个块不重叠,请尝试:

     <p style="text-align: left; width:49%; display: inline-block;">LEFT</p> <p style="text-align: right; width:50%; display: inline-block;">RIGHT</p> 

    HTML文件:

     <div class='left'> Left Aligned </div> <div class='right'> Right Aligned </div> 

    CSS文件:

     .left { float: left; } .right { float: right; } 

    你完成了….

    虽然这里的几个解决scheme将起作用,但是没有一个处理重叠得很好,最终将一个项目移到另一个项目的下面。 如果你正在尝试布局将被dynamic绑定的数据,那么直到运行时才会知道它看起来很糟糕。

    我喜欢做的只是创build一个单行表,并在第二个单元格上应用正确的浮动。 第一个不需要应用左alignment,这是默认情况下发生的。 这通过文字包装完美地处理重叠。

    HTML

     <table style="width: 100%;"> <tr><td>Left aligned stuff</td> <td class="alignRight">Right aligned stuff</td></tr> </table> 

    CSS

     .alignRight { float: right; } 

    https://jsfiddle.net/esoyke/7wddxks5/

    在你想要左右alignment的每个单词或一组单词上添加span。 然后在span上添加id或class,例如:

     <h3> <span id = "makeLeft"> Left Text</span> <span id = "makeRight"> Right Text</span> </h3> 

    CSS-

     #makeLeft{ float: left; } #makeRight{ float: right; } 

    如果你只是想改变文本的alignment方式,只需创build一个类

     .left { text-align: left; } 

    并通过文本跨越该类

     <span class='left'>aligned left</span>