HTML如何设置文字靠右？

推荐方法：使用CSS的text-align属性

适用场景：段落、标题、表格单元格等常规文本对齐。
示例代码：

<p style="text-align: right;">这段文字将靠右显示</p>

说明：

• 这是最标准、最简洁的方式,符合现代网页标准。
• 可通过CSS类批量控制（推荐）：

  <style>
    .right-align {
      text-align: right;
    }
  </style>
  <div class="right-align">多行文字也会整体靠右对齐</div>

浮动布局：float属性

适用场景：图文混排时让文本紧贴容器右侧（需清除浮动）。
示例：

<style>
  .float-right {
    float: right;
    clear: both; /* 防止其他元素环绕 */
  }
</style>
<div class="float-right">靠右浮动的文字</div>

注意：浮动可能影响布局，需配合clearfix技巧（MDN浮动指南）。

Flexbox弹性布局

适用场景：复杂布局中整体内容靠右（如导航栏、页脚）。
示例：

<style>
  .flex-container {
    display: flex;
    justify-content: flex-end; /* 子元素靠右 */
  }
</style>
<div class="flex-container">
  <div>项目1</div>
  <div>项目2</div> <!-- 所有子元素整体靠右 -->
</div>

Grid网格布局

适用场景精准控制位置。
示例：

<style>
  .grid-container {
    display: grid;
    justify-content: end; /* 网格内内容靠右 */
  }
</style>
<div class="grid-container">网格布局中的靠右文本</div>

绝对定位（谨慎使用）

适用场景：叠加在特定位置的小段文本（如角标）。
示例：

<style>
  .absolute-right {
    position: absolute;
    right: 10px; /* 距离容器右侧10像素 */
  }
</style>
<div style="position: relative;">
  <span class="absolute-right">固定在右侧</span>
</div>

️ 不推荐的方法

1. 过时的HTML属性（已废弃）：

   <!-- 避免使用 -->
   <p align="right">旧方法不推荐</p>
   <table><tr><td align="right">表格中同样废弃</td></tr></table>

   原因：HTML5已弃用align属性,无法响应不同设备尺寸。

2. <center>：
该标签在HTML5中被移除,请用CSS替代。