pc居中 手机居左 html代码 - 技术交流社区 - 站长交流 - 狐狸资源网

pc居中 手机居左 html代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  .text-center {
    text-align: center; /* 默认居中 */
  }
  /* PC端样式 */
  @media (min-width: 768px) {
    .text-center {
      text-align: center; /* PC端居中 */
    }
  }
  /* 手机端样式 */
  @media (max-width: 767px) {
    .text-center {
      text-align: left; /* 手机端居左 */
    }
  }
</style>
</head>
<body>

<div class="text-center">
  <span style="color: red"><i class="fa fa-bullhorn"></i>  <span id="weatherInfo"></span></span>
</div>

</body>
</html>

 

请登录后发表评论

    没有回复内容

随便看看