1# 添加图片区域 2 3添加图片区域通常用[image](../reference/arkui-js/js-components-basic-image.md)组件来实现，使用的方法和text组件类似。 4 5 6 7图片资源建议放在js\default\common目录下，common目录需自行创建，详细的目录结构见[目录结构](../ui/js-framework-file.md#目录结构)。代码示例如下： 8 9 10```html 11<!-- xxx.hml --> 12<image class="img" src="{{middleImage}}"></image> 13``` 14 15 16```css 17/* xxx.css */ 18.img { 19 margin-top: 30px; 20 margin-bottom: 30px; 21 height: 385px; 22} 23``` 24 25 26```js 27// xxx.js 28export default { 29 data: { 30 middleImage: '/common/ice.png', 31 }, 32} 33``` 34
