Home > Article > Web Front-end > What is the css code for text centering?
What is the css code for text centering?
- 青灯夜游Original
- 2021-03-09 10:54:4522093browse
The css code for text centering is "text-align:center;" or "line-height:value;". The text-align attribute specifies the horizontal alignment of the element's text. When the value is center, horizontal centering can be achieved; setting line-height can achieve vertical centering of the text.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
css text centering
#1. Text horizontally centered
text-align attribute specifies elements The horizontal alignment of the text in . When the value is center, horizontal centering can be achieved.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
div {
width: 300px;
height: 200px;
background: palegoldenrod;
text-align: center
}
</style>
</head>
<body>
<div>css 水平居中了--文本文字</div>
</body>
</html>Rendering:
[Recommended tutorial: CSS video tutorial]
2. Center the text vertically
line-height Center the single-line text vertically
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css 垂直居中</title>
<style>
.box{
width: 300px;
height: 300px;
background: palegoldenrod;
line-height:300px;
}
</style>
</head>
<body>
<div class="box">css 垂直居中了--文本文字</div>
</body>
</html>Rendering:
For more programming-related knowledge, please visit: programming video! !
The above is the detailed content of What is the css code for text centering?. For more information, please follow other related articles on the PHP Chinese website!