简单
技术面试0 次浏览

在拼多多的商品详情页中,需要展示商品的图片、价格、描述等信息。请编写一个简单的 HTML 和 CSS 代码,实现一个基本的商品详情展示布局,要求图片在左侧,文字信息在右侧。

拼多多前端工程师
HTMLCSS前端布局

答题要点

推荐使用分层分析法来解答此题。首先明确整体布局结构,再分别处理各个部分的样式。关键要点如下:1. HTML 结构搭建:使用 `<div>` 标签创建容器,分别放置图片和文字信息。2. CSS 布局设置:使用 `float` 或 `flexbox` 实现左右布局。3. 样式调整:设置图片和文字的样式,如宽度、边距等。示例话术:先创建一个父容器 `<div>`,将图片和文字信息分别放在两个子 `<div>` 中。然后使用 `display: flex` 使它们水平排列,再调整各自的样式,如图片的宽度和文字的边距。