I don't understand the meaning of isValid? and "!isValid"

I am studying Vue.js by referring to http://gihyo.jp/dev/serial/01/vuejs/0002?page=2.

<divid="example" v-bind:style="{'border':(isValid?':'1px solid red')}">
  <p>Name {{name}}</p>
  <pv-show="!isValid">
    Please enter a name
  </p>
</div>

and to js

 varvm = new Vue({
  el: '#example',
  data: {
    name: '' ,
  },
  computed: {
    isValid: function() {
      return this.name.length>0;
    }
  }
});
window.vm=vm;

"However, I do not understand the meaning of this isValid? and ""!isValid""When I move these codes, the red box and the letter "Please enter your name" are always displayed, but I thought isValid? and !isValid would be a match, but I didn't understand that these two were always displayed.