每日赛况

222000233_222000328/ausopen/ausopen/src/components/Day1.vue

 <template>
     <div>
-        
+        <div><h1>Rod Laver Arena</h1></div>
+        <b/>
+        <div id="tab1">
+            <table id="t1" width="300">
+                <tr>
+                    <td class="small">
+                        <b>Women's Singles&nbsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;Complete</b>
+                        <p>Round 1 • Rod Laver Arena&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;1h&nbsp;15m</p>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="big">
+                        <img src="static\pic\k.png" width="30" height="20">K.Siniakova&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;1&emsp;4
+                    </td>
+                </tr>
+                <tr>
+                    <td class="big">
+                        <img src="static\pic\c.png" width="30" height="20"><b>C.Gauff</b>
+                        &nbsp;7&emsp;&emsp;&emsp;&emsp;&emsp;<img src="static\pic\yes.png" width="20px" height="15px">
+                        &emsp;<b>6</b>&emsp;<b>6</b>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="small">
+                        <button class="btn" @click="details">Details Of The Matches</button>
+                    </td>
+                </tr>
+            </table>
+        </div>
+        <div id="tab2">
+            <table id="t1" width="300">
+                <tr>
+                    <td class="small">
+                        <b>Women's Singles&nbsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;Complete</b>
+                        <p>Round 1 • Rod Laver Arena&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;1h&nbsp;34m</p>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="big">
+                        <img src="static\pic\y.png" width="30" height="20">Y.Yuan&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;1&emsp;4
+                    </td>
+                </tr>
+                <tr>
+                    <td class="big">
+                        <img src="static\pic\m.png" width="30" height="20"><b>M.Sakkari</b>
+                        &nbsp;6&emsp;&emsp;&emsp;&nbsp;<img src="static\pic\yes.png" width="20px" height="15px">
+                        &emsp;<b>6</b>&emsp;<b>6</b>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="small">
+                        <button class="btn" @click="details">Details Of The Matches</button>
+                    </td>
+                </tr>
+            </table>
+        </div>
+        <div id="tab3">
+            <table id="t1" width="300">
+                <tr>
+                    <td class="small">
+                        <b>Women's Singles&nbsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;Complete</b>
+                        <p>Round 1 • Rod Laver Arena&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;3h&nbsp;41m</p>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="big">
+                        <img src="static\pic\r.png" width="30" height="20"><b>R.Nadal</b>
+                        &nbsp;1&emsp;&nbsp;<img src="static\pic\yes.png" width="20px" height="15px">
+                        &emsp;<b>7</b>&emsp;2&emsp;<b>6</b>&emsp;<b>6</b>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="big">
+                        <img src="static\pic\j.png" width="30" height="20">Jack Draper
+                        &emsp;&emsp;&emsp;5&emsp;<b>6</b>&emsp;4&emsp;1
+                    </td>
+                </tr>
+                <tr>
+                    <td class="small">
+                        <button class="btn" @click="details">Details Of The Matches</button>
+                    </td>
+                </tr>
+            </table>
+        </div>
     </div>
 </template>
 
 <script>
 export default {
-
-}
+    methods:{
+    details(){
+      alert("1111");
+    }
+  }
+      
+    }
 </script>
 
 <style>
+h1{
+    font-family: 'Segoe UI Black', Courier, monospace;
+    color: #81D3F8;
+    position: relative;
+    top: 35px;
+    left: 50px;
+}
+#tab1,#tab2,#tab3{
+    float: left;
+    margin-left: 50px;
+    margin-right: 50px;
+}
+#t1{
+    position: relative;
+    left: 100px;
+    top:60px;
+    border-style: none;
+    padding: 0;
+    margin: 2px;
+    border:1px solid #D7D7D7;
+}
+#t2{
+    position: relative;
+    left: 300px;
+    top:60px;
+    border-style: none;
+    padding: 0;
+    margin: 2px;
+    border:1px solid #D7D7D7;
+}
+#t3{
+    position: relative;
+    left: 600px;
+    top:60px;
+    border-style: none;
+    padding: 0;
+    margin: 2px;
+    border:1px solid #D7D7D7;
+}
+tr{
+    background-color:#FFFFFF;
+    color:#555555;
+}
+td{
+    padding: 10px;
+}
+.big{
+    font-size: 10;
+}
+.small{
+    font-size: 5px;
+}
+.btn{
+    width: 250px;
+    font-family: 'Segoe UI Black', Courier, monospace;
+    font-size: 15px;
+    background-color: rgba(215, 215, 215, 0.3);
+    border-radius: 10%;
+    color:#02A7F0;
+    position: relative;
+    left: 10px;
+}
 
 </style>
\ No newline at end of file

222000233_222000328/ausopen/ausopen/src/components/DayButtons.vue

@@ -27,7 +27,7 @@
 export default {
     methods:{
     day1(){
-      alert("跳转");
+      alert("1111");
     }
   },
   methods:{
@@ -65,5 +65,9 @@ li{
     width: 50px;
     height: 50px;
 }
+.buttons{
+    position: relative;
+    top:20px;
+}
 
 </style>
\ No newline at end of file

222000233_222000328/ausopen/ausopen/src/view/DailySchedule.vue

@@ -5,8 +5,11 @@
       </div>
     <div id="menu"><Menu/></div>
     <div id="content">
-      <div><DayButtons/></div>
-      <div><Day1/></div>
+      <div id="btn"><DayButtons/></div>
+      <b/>
+      
+      <b/>
+      <div id="day"><Day1/></div>
     </div>
   </div>
 </template>
@@ -45,4 +48,5 @@ export default {
 }
 
 
+
 </style>
\ No newline at end of file