要让图片排成一排，可以使用HBuilder中的flex布局或者grid布局来实现。
使用flex布局的步骤如下：
在HTML文件中创建一个父容器，设置其display属性为flex，并指定flex-direction为row，表示子元素水平排列。在父容器中添加需要排列的图片作为子元素，可以使用<img>标签或者<div>标签设置背景图。可以通过为子元素添加flex-grow属性来设置子元素的宽度，为0表示不放大，为1表示自动放大。示例代码如下：
<!DOCTYPE html><html><head><style>.container { display: flex; flex-direction: row;}img { flex-grow: 1;}</style></head><body><div class="container"> <img src="https://static.jirixiang.com/image/lazy.gif" class="lazy" original="https://static.jirixiang.com/image/nopic320.png" <img src="https://static.jirixiang.com/image/lazy.gif" class="lazy" original="https://static.jirixiang.com/image/nopic320.png" <img src="https://static.jirixiang.com/image/lazy.gif" class="lazy" original="https://static.jirixiang.com/image/nopic320.png">使用grid布局的步骤如下：
在HTML文件中创建一个父容器，设置其display属性为grid。在父容器中添加需要排列的图片作为子元素，可以使用<img>标签或者<div>标签设置背景图。可以通过为父容器设置grid-template-columns属性来设置列的数量和宽度。示例代码如下：
<!DOCTYPE html><html><head><style>.container { display: grid; grid-template-columns: 1fr 1fr 1fr; }img { width: 100%;}</style></head><body><div class="container"> <img src="https://static.jirixiang.com/image/lazy.gif" class="lazy" original="https://static.jirixiang.com/image/nopic320.png" <img src="https://static.jirixiang.com/image/lazy.gif" class="lazy" original="https://static.jirixiang.com/image/nopic320.png" <img src="https://static.jirixiang.com/image/lazy.gif" class="lazy" original="https://static.jirixiang.com/image/nopic320.png">以上是两种常见的方法，根据具体需求选择适合的布局方式。
