小编Gir*_* BN的帖子

任何人都可以帮助实现UL的鼠标功能,我的模板中有一组使用相同类的UL标签,但是当我尝试实现鼠标悬停(在鼠标悬停时更改边框颜色)时,所有的UL标签都是该课程正在突出显示.我对VUE很陌生.

模板

<ul v-bind:class="[sbitmcls]"  @mouseover="mouseOver" @mouseleave="mouseOut">
  <img src="../assets/notification.png" alt="" height="30" width="30">
  <span> Notification  </span>
</ul>

<ul v-bind:class="[sbitmcls]"  @mouseover="mouseOver" @mouseleave="mouseOut">
  <img src="../assets/message.png" alt="" height="30" width="30">
  <span> Message  </span>
</ul>

脚本

data() {
  return {
    sbitmcls: "image",
    active: true
    };
  },
  methods: {
    onClick() {
    this.$router.push("/homepage");
  },
  mouseOver: function(name) {
    this.sbitmcls = "imageSelected"
  },
  mouseOut: function() {
    event.target.style.background = "#4a4b45";
  }
}

样式:

.image {
  display: relative;
  background-color: #4a4b45;
  color: white;
  font-family: Rubik, "Bookman", Garamond, "Times New Roman", Times, serif;
  font-size: 1.2em; …

你好 Vue/css 专家，

我是 VUE 的新手，我现在正在努力学习，使用我开发的所有 VUE 应用程序，页面顶部和左侧似乎有一个细小的白色边框，当我有一个黑暗的时候它变得很烦人背景。有什么办法可以消除吗？？

下面是代码

<!-- main.js-->  
import Vue from 'vue'
import App from './App.vue'

new Vue({
  el: '#app',
  render: h => h(App)
})


<!-- App.vue-->
<template>
  <div id="app" class="initial">
      <router-view class='initial'></router-view>
    </div>
</template>

<script>
import axios from "axios";
import Cookies from "js-cookie";
export default {
  name: "app",
  mounted() {}
};
</script>
<style>
.initial {
  background-size: cover;
  background: linear-gradient(
    to bottom,
    rgb(98, 208, 223) 0%,
    rgb(7, 65, 73) 100%
  );
  position: absolute;
  width: 100%;
  height: 100%; …