css设置右对齐的方法：1、使用cssposition属性实现右对齐。2、通过float属性实现右对齐。3、通过text-align属性实现右对齐。

通过css设置右对齐方法详解：

1、通过css的position属性实现右对齐

右对齐

以下实例演示了如何使用 position 来实现右对齐:

css代码：.right {

position: absolute;

right: 0px;

width: 300px;

border: 3px solid #73AD21;

padding: 10px;

}

效果图：

2、通过float属性实现右对齐

img

{

float:right

}

在下面的段落中，我们添加了一个样式为 float:right 的图像。结果是这个图像会浮动到段落的右侧。

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

This is some text. This is some text. This is some text.

效果图：

3、通过text-align属性实现右对齐

h1 {text-align: center}

h2 {text-align: left}

h3 {text-align: right}

这是标题 1

这是标题 2

这是标题 3

效果图：

文本的位置在网页布局中是必不可少的，今天的这篇文章就来给大家分享关于使用CSS实现文本左对齐、右对齐和居中对齐的方法，下面我们来看具体的内容。

要设置文本对齐(左对齐，右对齐，居中对齐)需要用到的CSS属性是text-align属性。(相关推荐：CSS学习手册)

语法格式：text-align :(文本位置)位置说明

left左对齐

right右对齐

center居中对齐

justify两端对齐

接下我们来分别看看这四种对齐方式的设置方法

文本左对齐的设置方法：text-align：left;

文本右对齐设置方法：text-align：right;

文本居中对齐设置方法：text-align：center;

文本两端对齐设置方法：text-align：justify;

我们来看具体的代码示例1：

TextAlign.html

TextAlign.css.TextLeft{

margin-top:24px;

margin-left:32px;

border:1px solid #ff6a00;

width:480px;

text-align:left;

}

.TextRight {

margin-top: 24px;

margin-left: 32px;

border: 1px solid #ff6a00;

width: 480px;

text-align: right;

}

.TextCenter {

margin-top: 24px;

margin-left: 32px;

border: 1px solid #ff6a00;

width: 480px;

text-align: center;

}

.TextJustify {

margin-top: 24px;

margin-left: 32px;

border: 1px solid #ff6a00;

width: 480px;

text-align: justify;

text-justify: distribute-all-lines;

}

显示结果

使用Web浏览器显示上述HTML文件。将显示如下所示的效果。

代码示例2：

文本左对齐：

.leftText{

text-align:left;

}

文本右对齐：

.rightText{

text-align:right;

}

居中对齐：

.centerText{

text-align:center;

}

本篇文章到这里就全部结束了，更多关于文本对齐的内容大家可以关注php中文网的CSS视频教程栏目！！！