1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<template>
<!-- 可以使用几乎任何方法定义content中的文字和图片样式 -->
<span class="ribbon">Notice where the orange box is.</span>
</template>
<script setup>
</script>
<style scoped>
.ribbon {
background-color: #5BC8F7;
}
.ribbon::before {
content: "Look at this orange box.";
background-color: #FFBA10;
border-color: black;
border-style: dotted;
}
</style>
|