dw怎么设置图片居中?
2023-11-10 阅读 98
在CSS中,可以使用以下代码将图片居中显示:
```css
img {
display: block;
margin: 0 auto;
}
```
在上述代码中,`display: block;`将图片转换为块级元素,使其可以设置宽度和高度。`margin: 0 auto;`将左右边距设置为自动,这样图片就会在父元素中水平居中显示。
另外,如果要将图片在垂直方向上居中显示,可以使用以下代码:
```css
.container {
display: flex;
align-items: center;
justify-content: center;
}
```
在上述代码中,`.container`是包含图片的父元素,`display: flex;`将其设置为弹性容器,`align-items: center;`将子元素在垂直方向上居中对齐,`justify-content: center;`将子元素在水平方向上居中对齐。这样图片就会在父元素中水平和垂直方向上都居中显示。
更新于 2023年11月10日