How to set right alignment in css

藏色散人
Release: 2023-01-04 09:35:43
Original
29443 people have browsed it

How to set right alignment in css: 1. Use the cssposition attribute to achieve the right alignment effect; 2. Use the float attribute to achieve the right alignment effect; 3. Use the text-align attribute to achieve the right alignment effect.

How to set right alignment in css

The operating environment of this article: windows7 system, CSS3&&HTML5 version, Dell G3 computer.

Detailed explanation of the right alignment method through css:

1. Right alignment through the position attribute of css

右对齐

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

元素右对齐

css代码: .right { position: absolute; right: 0px; width: 300px; border: 3px solid #73AD21; padding: 10px; }
Copy after login

Rendering:

How to set right alignment in css

2. Right alignment is achieved through the float attribute

   

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

How to set right alignment in css 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.

Copy after login

Rendering:

How to set right alignment in css

3. Right alignment is achieved through the text-align attribute

   

这是标题 1

这是标题 2

这是标题 3

Copy after login

Rendering:

How to set right alignment in css

[Recommended learning:css video tutorial]

The above is the detailed content of How to set right alignment in css. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
css
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!