微信小程序 首页 须知 代码

以下是微信小程序首页须知的代码示例：

<!-- index.wxml -->
<view class="container">
  <view class="notice">
    <image class="icon" src="../../images/notice.png" />
    <text class="text">本小程序仅用于学习交流，请勿商用。</text>
  </view>
  <!-- 此处为首页其他内容 -->
</view>

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

.notice {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20rpx;
  background-color: #f5f5f5;
  border: 1rpx solid #e8e8e8;
}

.icon {
  width: 30rpx;
  height: 30rpx;
  margin-right: 10rpx;
}

.text {
  font-size: 28rpx;
  color: #666;
}

说明：

- 在 `index.wxml` 文件中，使用了一个 `view` 容器包裹整个页面内容。
- 在 `container` 容器中，使用了一个名为 `notice` 的容器，用于显示须知内容。
- `notice` 容器中包含了一个图片和一段文本，使用了 `image` 和 `text` 标签进行展示。
- 在 `index.wxss` 文件中，设置了 `container` 容器为屏幕高度的 100%。
- 设置了 `notice` 容器的样式，包括背景色、边框、内边距等。
- 设置了 `icon` 图片的样式，包括宽度、高度、右侧边距等。
- 设置了 `text` 文本的样式，包括字体大小、颜色等。