css中文字图片居中对齐

CSS是前端开发中不可或缺的一部分，而文字和图片的居中对齐在网页设计中也是非常重要的。下面我们就来介绍一下在CSS中如何实现文字和图片的居中对齐。
1、文字居中对齐
在CSS中，可以通过text-align属性来实现文字的居中对齐。通常，text-align可以设置以下几个取值：left（左对齐）、right（右对齐）、center（居中对齐）和justify（两端对齐）。
例如，想让一个段落中的文字居中显示，可以这样写：

<p style="text-align:center;">这是一个居中对齐的段落。</p> 

2、图片居中对齐
与文字不同，图片的居中对齐需要使用CSS中的display属性和margin属性来实现。其中，display可以设置以下几个取值：block（块级元素）、inline-block（内联块级元素）和inline（内联元素）。
例如，想让一张图片居中显示，可以这样写：

<div style="text-align:center;">
    <img src="picture.jpg" style="display:block; margin:auto;">
</div> 

在上面的代码中，首先将图片放到一个div容器中，并将其水平居中。然后，通过设置img标签的display为block，使其变成一个块级元素；再通过设置margin为auto，使其在块级元素中水平和垂直居中。
除了以上的方法外，还可以使用Flexbox布局或者Grid布局来实现文字和图片的居中对齐。而且，在CSS3中还新增了很多居中对齐的方法，例如transform、table-cell等。如何选择最适合自己的方法，需要根据具体的场景来决定。
总之，无论在何时何地，实现文字和图片的居中对齐都是前端开发中必备的技能，希望以上介绍的方法对大家有所帮助。