前端知识点1-text align是写在父级居中还是子级 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!-- text-align水平居中是对父级使用还是子级使用  -->
    <div style="width: 100px; height: 100px; border: 1px solid #ccc">
      <p>居中</p>
    </div>
    <div style="width: 100px; height: 100px; border: 1px solid #ccc">
      <p style="text-align: center">居中</p>
    </div>
    <div
      style="
        width: 100px;
        height: 100px;
        border: 1px solid #ccc;
        text-align: center;
      "
    >
      <p>居中</p>
      <!-- text-align属性，只对子元素起作用，并且可以被子元素继承 -->
    </div>
  </body>
</html>

text-align属性，只对子元素起作用，并且可以被子元素继承

posted @ 2023-01-07 09:31  前端导师歌谣  阅读(22)  评论(0)    收藏  举报  来源