css左边是图右边是文字

在前端页面设计中，常常需要使用到左侧是图片右侧是文本的布局。这种布局不仅美观，而且协调，能够很好地帮助我们传达设计和信息的意图。 在实现这种布局时，CSS是必不可少的工具，下面我们来看一下实现方式：

.left-img-right-text{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.left-img{
    width: 40%;
}

.right-text{
    width: 55%;
}

上述代码使用了CSS flex布局，将整个容器分为左右两部分。左侧图片的宽度为40%，右侧文本的宽度为55%。其中，使用flex-wrap将文本的多行排列自动调整，并使用justify-content:space-between将两个子元素之间的空白平均分布。这些CSS属性的组合相当简单，在可响应和移动设备上可轻松实现左侧是图片右侧是文本的布局。