<template>
<div>
<div id="neon-btn">
<button class="btn one">Hover Hover look</button>
<button class="btn two">Hover Hover look</button>
<button class="btn three">Hover Hover look</button>
</div>
</div>
</template>
<script>
export default {
name: "page",
props: {},
data() {
return {
name: "这是子组件的name",
};
},
created() {},
mounted() {},
destroyed() {},
methods: {},
};
</script>
<style lang="scss" scoped>
#draw-border {
display: flex;
align-items: center;
justify-content: center;
}
button {
border: 0;
background: none;
text-transform: uppercase;
color: #4361ee;
font-weight: bold;
position: relative;
outline: none;
padding: 10px 20px;
box-sizing: border-box;
}
button::before,
button::after {
box-sizing: inherit;
p
原创 css:hover用法(3)边框效果
猜你喜欢
转载自blog.csdn.net/jieweiwujie/article/details/126647882
今日推荐
周排行