uniapp修改全局页面背景，实现上半页面蓝色渐变白色，下边是纯白色

要修改uniapp应用中全局页面的背景样式，特别是在顶部区域实现蓝色渐变到白色的过渡效果，以及底部保持纯白色，您可以不直接在每个页面的模板中添加CSS，而是通过Vue.js的`beforeCreate`生命周期钩子或者全局样式表（如`uni-app.json`中的`globalStyle`）来设置这种全局样式。这样可以保证变化对所有页面生效。

以下是一个简单的示例，假设您想要在`uni-app.json`的`globalStyle`部分定义这个样式：

{
  "window": {
    ...
    "backgroundTextStyle": "light", // 设置默认背景色风格为白色
    "styles": [
      "@global {
        .blue-gradient-wrap {
          /* 使用CSS变量控制颜色渐变 */
          background: linear-gradient(to bottom, 
            var(--primary-color, #00BFFF), 
            white);
          height: 100%; /* 或者根据实际需求调整高度 */
          position: relative;
        }
        
        .content {
          padding-top: var(--gradient-height, 100px); /* 渐变的高度 */
          color: black;
          overflow-y: auto;
        }
      }"
    ]
  },
  ...
}

然后，在每个页面的`<template>`中，只需要确保顶部有`.blue-gradient-wrap`类，底部有`.content`类，比如：

<!-- 每个页面 -->
<template>
  <view class="blue-gradient-wrap">
    <!-- 可能的头部元素 -->
    <view class="header">...</view>
    <view class="content">
      <!-- 页面内容 -->
      <view>...</view>
    </view>
  </view>
</template>

这样，当页面加载时，就会应用这些全局样式。如果你想动态改变渐变的颜色，可以通过JavaScript设置CSS变量`--primary-color`。例如，如果你有一个按钮触发颜色更改：

// 在某个事件处理器中
this.$refs.blueGradientWrap.style.setProperty('--primary-color', '#abcdef');

请注意，这里仅给出了基本的指导，具体实现可能需要根据您的实际需求和UI设计进行调整。同时，确保在`uni-app.json`中设置了正确的主题颜色方案(`window.backgroundTextStyle`)以与渐变背景相匹配。