notFound.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <div id="pages">
  3. <h5>404</h5>
  4. <span @click="$router.back(-1)">{{$t("Back to previous page")}}</span>
  5. </div>
  6. </template>
  7. <script>
  8. export default {
  9. data () {
  10. return {
  11. msg: 'Welcome to Your Vue.js App'
  12. }
  13. },
  14. }
  15. </script>
  16. <!-- Add "scoped" attribute to limit CSS to this component only -->
  17. <style scoped>
  18. #pages {
  19. position: absolute;
  20. top:0;
  21. bottom: 0;
  22. left: 0;
  23. right: 0;
  24. width: 100%;
  25. overflow: hidden;
  26. display: block;
  27. margin: 0 auto;
  28. background:#2c2e2f
  29. }
  30. h5 {
  31. width: 100%;
  32. overflow: hidden;
  33. display: block;
  34. margin: 0 auto;
  35. font-size: 160px;
  36. text-align: center;
  37. margin-top: 10%;
  38. color: #fff;
  39. font-weight: normal;
  40. }
  41. span {
  42. width: 200px;
  43. height: 45px;
  44. overflow: hidden;
  45. display: block;
  46. margin: 0 auto;
  47. margin-top: 10%;
  48. background:#FFA200 ;
  49. color: #fff;
  50. font-size: 18px;
  51. text-align: center;
  52. border-radius: 250px;
  53. line-height: 45px;
  54. cursor: pointer;
  55. }
  56. span:hover {
  57. background: #FFA200;
  58. }
  59. </style>