mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2024-12-27 05:00:48 +08:00
Code Issues Packages Projects Releases Wiki Activity
db5d80cc5c
naive-ui/demo/documentation/components/descriptions/enUS/bordered.md
07akioni 2a226de170 doc(descriptions): zh-cn
2020-02-04 15:29:15 +08:00

1.5 KiB
Raw Blame History

Bordered

If there are too many multiple line fields, you can set it to bordered.

<n-descriptions bordered>
  <n-descriptions-item>
    <template v-slot:label>
      Breakfast
    </template>
    Apple
  </n-descriptions-item>
  <n-descriptions-item label="Lunch">
    Apple
  </n-descriptions-item>
  <n-descriptions-item label="Supper">
    Apple
  </n-descriptions-item>
  <n-descriptions-item label="Why Long">
    Why <br> Long <br> Long <br> Long <br> Long <br> Long
  </n-descriptions-item>
  <n-descriptions-item label="Why Long">
    Why <br> Long <br> Long <br> Long <br> Long <br> Long
  </n-descriptions-item>
  <n-descriptions-item label="Why Long">
    Why <br> Long <br> Long <br> Long <br> Long <br> Long
  </n-descriptions-item>
</n-descriptions>
<n-descriptions label-placement="left" bordered>
  <n-descriptions-item>
    <template v-slot:label>
      Breakfast
    </template>
    Apple
  </n-descriptions-item>
  <n-descriptions-item label="Lunch">
    Apple
  </n-descriptions-item>
  <n-descriptions-item label="Supper">
    Apple
  </n-descriptions-item>
  <n-descriptions-item label="Why Long">
    Why <br> Long <br> Long <br> Long <br> Long <br> Long
  </n-descriptions-item>
  <n-descriptions-item label="Why Long">
    Why <br> Long <br> Long <br> Long <br> Long <br> Long
  </n-descriptions-item>
  <n-descriptions-item label="Why Long">
    Why <br> Long <br> Long <br> Long <br> Long <br> Long
  </n-descriptions-item>
</n-descriptions>

.n-descriptions {
  margin-top: 16px;
}