如何使用 CSS 实现图片和文本水平居中对齐，并且文本换行？

哈喽！大家好，很高兴又见面了，我是golang学习网的一名作者，今天由我给大家带来一篇《如何使用 CSS 实现图片和文本水平居中对齐，并且文本换行？》，本文主要会讲到等等知识点，希望大家一起学习进步，也欢迎大家关注、点赞、收藏、转发! 下面就一起来看看吧！

如何使用 css 实现内容居中对齐

你想实现的效果是：

• 图片和主要参建单位水平居中对齐
• 右侧文本换行，但第一行与参建单位对齐

css 代码实现：

  图片
  

    主要参建单位：
    这是一个很长很长很长的文本，可以换行。
  

• display: flex;: 将容器设为 flex 布局。
• align-items: center;: 将所有子元素垂直居中对齐。
• justify-content: center;: 将所有子元素水平居中对齐。
• span 作为图片占位符可以自定义宽高，设置背景色为红色方便查看。
• p 标签加入 flex: 1; 属性，剩余空间自适应填充。
• span 用于加粗主要参建单位。

今天带大家了解了的相关知识，希望对你有所帮助；关于文章的技术知识我们会一点点深入介绍，欢迎大家关注golang学习网公众号，一起学习编程~