我们提供了以下几种边框样式，以供选择。

top-start

top

top-end

right-start

right

right-end

bottom

bottom-start

bottom-end

left

left-start

left-end

<template>
  <div class="tooltip-example">
    <wl-row :gutter="20">
      <wl-col :span="6" v-for="tooltipType in tooltipTypes">
        <wl-tooltip  :content="tooltipType" :type="tooltipType">
          <wl-button>{{ tooltipType }}</wl-button>
        </wl-tooltip>
      </wl-col>
    </wl-row>
  </div>
</template>

<script lang="ts" setup>
import { tooltipTypes } from '@whale-ui/components';
import { WlTooltip,WlButton,WlRow,WlCol } from 'whale-ui';
</script>

<style scoped>
.wl-row {
  gap: 30px 0px;
}

</style>```