Home >Web Front-end >CSS Tutorial >How to set the alignment of two words and three words in css
How to set the alignment of two words and three words in css
- 青灯夜游Original
- 2021-03-09 14:55:148750browse
In CSS, you can use the text-align attribute to align two words and three words; you only need to set the "text-align: justify;" style to the text element, which can realize text Alignment effect, aligning three words and two words.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
css two-word and three-word alignment
<!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>Rendering:
Instructions ：
In CSS, text-align has an attribute value of justify, which means alignment. The effect achieved is that a line of text can be displayed aligned at both ends (the text content must exceed one line).
But just using it is still useless...
To align the text at both ends, we have to use an inline empty tag to help, such as , tag
: CSS video tutorial, html video tutorial
The above is the detailed content of How to set the alignment of two words and three words in css. For more information, please follow other related articles on the PHP Chinese website!