<template>
  <div>
    <div class="box0">
      <p>a: {{a}}</p>
      <p>b: {{b}}</p>
      <p>c: {{c}}</p>
      <p>d: {{d}}</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Testscreen',
  data () {
    return {
      a: '',
      b: '',
      c: '',
      d: ''
    }
  },
  mounted () {
    // alert(document.body.clientWidth, 'a')
    // alert(document.body.clientHeight, 'b')
    // alert(window.screen.width, 'c')
    // alert(window.screen.height, 'd')
    this.a = document.body.clientWidth
    this.b = document.body.clientHeight
    this.c = window.screen.width
    this.d = window.screen.height
  }
}
</script>

<style lang="stylus" scoped>
.box0
  padding-top 200px
  text-align center
  p
    font-size 46px
    line-height 70px
</style>
