CSS base (X) - the border and make other styles of fonts center


Essays and records to facilitate their access to fellow travelers, it is best to learn HTML learning CSS.

#------------------------------------------------I ------------------------------------------- dividing line is a shame

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>input系列</title>
</head>
<body>
    <div class="c1 c2" style="border:1px solid red; width:50%; height:100px; font-size:30px; text-align:center;"> nihaone</div>
</body>
</html>

effect:

text-align: center; wherein represents a set font text-align center positions intermediate represented, only the middle level of this, not down the middle, there is a better way, see below Code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>input系列</title>
</head>
<body>
    <div class="c1 c2" style="
    border:1px solid red;
    width:50%;
    height:100px;
    font-size:30px;
    text-align:center;
    line-height:100px;
"> nihaone</div>
</body>
</html>

effect:

line-height: 100px; represents the font into 100px middle, and this number to be highly consistent, otherwise the wrong format, such as high 40px , the font you put 100px center

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>input系列</title>
</head>
<body>
    <div class="c1 c2" style="
    border:1px solid red;
    width:50%;
    height:400px;
    font-size:30px;
    text-align:center;
    line-height:100px;
"> nihaone</div>
</body>
</html>

 

effect:

 

Guess you like

Origin www.cnblogs.com/lirongyang/p/11303372.html