简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Rumah > hujung hadapan web > tutorial css > teks badan

css怎么设置两个字和三个字对齐

青灯夜游
Lepaskan： 2023-01-03 09:28:42
asal
8638 orang telah melayarinya

在css中，可以使用text-align属性来让两个字和三个字对齐；只需要给文本元素设置“text-align: justify;”样式即可，该样式可以实现文本两端对齐效果，让三个字和两个字对齐。

css怎么设置两个字和三个字对齐

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

css两个字和三个字对齐

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">

    <style>
        p{
            width: 70px;
            height: 40px;
            line-height: 40px;
            background: paleturquoise;
            text-align: justify;
        }
        p > span {
            display: inline-block /* Opera */;
            padding-left: 100%;
        }
    </style>
</head>
<body>
    <p>你好<span></span></p>
    <p>大家好<span></span></p>
    <p>同学们好<span></span></p>
</body>
</html>
Salin selepas log masuk

效果图：

 1.png

说明：

在CSS中，text-align 有一个属性值为 justify ，为对齐之意。其实现的效果就是可以让一行文字两端对齐显示（文字内容要超过一行）。

但是光使用它依然没什么卵用…..

要使文字两端对齐，我们还得使用一个行内空标签来助阵，比如 、 等等，这里是我用 标签

推荐教程：CSS视频教程 、html视频教程

Atas ialah kandungan terperinci css怎么设置两个字和三个字对齐. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan：
css Penjajaran
sumber：php.cn
Artikel sebelumnya：css中怎么改变超链接颜色 Artikel seterusnya：css上下间距怎么设置
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
WordPress 6.0 (add_editor_style) tidak memuatkan style.css dalam editor Gutenberg Saya mengikuti kursus UdemyWordPress untuk mencipta tema blok WordPress tersuai. Saya berj...
daripada 2023-11-12 20:37:50
0
2
261
CSS mendahului sifar untuk perpuluhan yang tidak berfungsi dengan nombor yang besar Baru-baru ini saya menghadapi masalah di mana saya mencipta senarai tersusun dengan lebih ...
daripada 2023-11-07 10:35:53
0
1
236
Ralat Sass: Fail telah dimuatkan: @import '~src/css/quasar.variables.scss', 'quasar/src/css/variables.sass'; Saya menggunakan rangka kerja quasar dan semasa menyusun projek saya, saya mengalami ralat...
daripada 2023-11-06 21:38:55
0
1
219
Bagaimana untuk membenamkan video latar belakang dalam HTML/CSS? Hai semua, baru-baru ini saya menghadapi masalah. Saya cuba untuk menetapkan latar belakan...
daripada 2023-11-06 13:59:13
0
1
240
Bagaimana untuk mendapatkan nilai RGB warna bernama CSS/HTML dalam JavaScript Saya telah mencipta objek Javascript yang dipanggil [name-rgb]. Asas anda:namedColors={Ali...
daripada 2023-11-06 09:05:50
0
2
210
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina：Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！