我想要微信小程序简单详情页面的代码，商品图片放中间，价格和文字放下面，装饰的好看一点，只需要wxss和wxml

好的，下面是一个简单的微信小程序详情页面的代码，包括wxml和wxss部分。其中商品图片使用了flex布局居中显示，价格和文字使用了grid布局放在了下方，装饰使用了border和圆角等。

wxml部分：

<view class="container">
  <view class="image-wrapper">
    <image class="image" src="商品图片地址"></image>
  </view>
  <view class="info-wrapper">
    <view class="name">商品名称</view>
    <view class="price">¥ 99.99</view>
    <view class="description">商品描述</view>
  </view>
</view>

wxss部分：

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.image-wrapper {
  width: 90%;
  height: 40%;
  margin-bottom: 20px;
  border-radius: 10px;
  overflow: hidden;
}

.image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.info-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto 1fr;
  gap: 10px;
  width: 90%;
  padding: 10px;
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.name {
  font-size: 18px;
  font-weight: bold;
}

.price {
  font-size: 20px;
  font-weight: bold;
  color: #ff4545;
}

.description {
  font-size: 14px;
  color: #999;
  grid-column: 1 / 3;
}

需要注意的是，这份代码只是一个简单的示例，具体的布局和样式根据实际需求进行调整。另外，商品图片地址需要替换为实际的图片地址。