Browse Source

新增页面 src/views/NewPages/iframe4.vue 未配置路由

刘靖诗 3 years ago
parent
commit
7b0aefb7a9
2 changed files with 66 additions and 0 deletions
  1. BIN
      src/assets/background-iframe4.png
  2. 66 0
      src/views/NewPages/iframe4.vue

BIN
src/assets/background-iframe4.png


+ 66 - 0
src/views/NewPages/iframe4.vue

@@ -0,0 +1,66 @@
+<template>
+    <div class="iframe4">
+      <div class="back"></div>
+      <iframe src="https://www.baidu.com/" frameborder="0" class="iframe-1"></iframe>
+      <iframe src="https://www.baidu.com/" frameborder="0" class="iframe-2"></iframe>
+      <iframe src="https://www.baidu.com/" frameborder="0" class="iframe-3"></iframe>
+      <iframe src="https://www.baidu.com/" frameborder="0" class="iframe-4"></iframe>
+    </div>
+</template>
+
+<script>
+
+export default {
+    setup() {},
+    components: {},
+    data() {
+        return {};
+    },
+    created() {},
+};
+</script>
+
+<style lang="less">
+.iframe4 {
+  .back {
+    position: fixed;
+    z-index: -1;
+    width: 100vw;
+    height: 100vh;
+    top: 0;
+    left: 0;
+    background: url(../../assets/background-iframe4.png) no-repeat;
+    background-size: 100% 100%;
+  }
+
+  .iframe-1,
+  .iframe-2,
+  .iframe-3,
+  .iframe-4 {
+    position: fixed;
+    z-index: 1;
+    width: 37.4vw;
+    height: 37.31vh;
+  }
+
+  .iframe-1,
+  .iframe-3 {
+    left: 6.61vw;
+  }
+
+  .iframe-1,
+  .iframe-2 {
+    top: 10.74vh;
+  }
+
+  .iframe-2,
+  .iframe-4 {
+    left: 56.09vw;
+  }
+
+  .iframe-3,
+  .iframe-4 {
+    top: 57.31vh;
+  }
+}
+</style>