border-radius.uvue 1.2 KB
Newer Older
DCloud-WZF's avatar
DCloud-WZF 已提交
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46
<template>
  <!-- #ifdef APP -->
  <scroll-view style="flex: 1">
  <!-- #endif -->
    <view style="flex-grow: 1">
      <view>
        <text>border-radius: 10px</text>
        <view class="common" style="border-radius: 10px"></view>
      </view>

      <view>
        <text>border-top-left-radius: 10px</text>
        <view class="common" style="border-top-left-radius: 10px"></view>
      </view>

      <view>
        <text>border-top-right-radius: 10px</text>
        <view class="common" style="border-top-right-radius: 10px"></view>
      </view>

      <view>
        <text>border-bottom-left-radius: 10px</text>
        <view class="common" style="border-bottom-left-radius: 10px"></view>
      </view>

      <view>
        <text>border-bottom-right-radius: 10px</text>
        <view class="common" style="border-bottom-right-radius: 10px"></view>
      </view>

      <view>
        <text>border-radius: 250px(与长宽相同形成正圆)</text>
        <view class="common" style="border-radius: 250px"></view>
      </view>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>

<style>
  .common {
    width: 250px;
    height: 250px;
    background-color: gray;
  }
DCloud-WZF's avatar
DCloud-WZF 已提交
47
</style>