如何更改h3文本的位置

Question

我有以下HTML和CSS：

//Image Size: 3 MB
let image = UIImage.init(named: "2.jpg")!    
print("Start Conversion: Image to CGImage",Date())
let cgImageSample = image.cgImage
print("End Conversion: Image to CGImage",Date())        
print("Start Conversion: CGImage to UIImage",Date())    
let imageConverted = UIImage(cgImage: cgImageSample!)
print("End Conversion:CGImage to UIImage",Date())

@media(max-width: 1920) and (min-width: 769) {
  cfa-text {
    margin-left: 20px! Important;
  }
}

@media (max-width: 1920) and (min-width: 769) {
  .cfa- text {
    margin-left: 20px! Important;
  }
}

@media (max-width: 1920) and (min-width: 769) {
  body.cfa-text {
    margin-left: 20px! Important;
  }
}

@media (max-width: 1920) and (min-width: 769) {
  .col-v. sm-9 {
    margin-left: 20px! Important;
  }
}

@media (max-width: 1920) and (min-width: 769) {
  .h3 {
    margin-left: 200px! Important;
  }
}

我希望文本位于页面的中心。此刻在桌面视图中略微位于左侧。

Answer 1

向text-sm-left text-md-center添加h3引导类。希望这是您想要的。谢谢

(max-width: 1920) and (min-width: 769) {
  cfa-text {
    margin-left: 20px! Important;
  }
}

(max-width: 1920) and (min-width: 769) {
  .cfa-text {
    margin-left: 20px! Important;
  }
}

(max-width: 1920) and (min-width: 769) {
  body.cfa-text {
    margin-left: 20px! Important;
  }
}

(max-width: 1920) and (min-width: 769) {
  .col-sm-9 {
    margin-left: 20px! Important;
  }
}

(max-width: 1920) and (min-width: 769) {
  .h3 {
    margin-left: 200px! Important;
  }
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<div class="col-sm-9">
  <h3 class="cfa-text text-sm-left text-md-center"> "Professional, thorough, diligent<br /><br /> Excellent, my flat looked brand new after they had finished. Still can't get over those sparkling taps. Thanks to Nico and the team for a job well done."
  </h3>
</div>