Question

首先，我对编程世界很陌生，在锁定期间，为了做点什么，我决定创建一个简单的网页，在其中搜索所有我的Zoom类，方法是在网站上搜索资源和HTML教程。互联网。我找不到能使我的网站适应屏幕尺寸的方法，因为它现在很大。代码如下：

    <!DOCTYPE html>
<html>
<head>
 <script>
   function zoomother(){
     window.open ("https://www.zoom.us/join");
   }
    </script>
    <script>
   function manoli(){
     window.open ("zoommtg://us04web.zoom.us/join?action=join&confid=dXNzPTAxMjhkZmM1LjhjVW5ZbDIxRDZSeG1BdEhMVjUwbWhNMlBJOHVTZzNoUVRGY1lXS01SRXhNdTdKTGR6ajUzQUM2cWhqWks1OGRFMDlmbDFGZ2xHem1Da0Q1eW04WFhnJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=5871168619&zc=0&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
    <script>
   function jordi(){
     window.open ("zoommtg://us04web.zoom.us/join?action=join&confid=dXNzPTRmZjVlMzFlLnRYVk90TFJCLVpDRWJXdjlzTHFUaGVZZXNMcm1UQlhRMW1XRXRKTV9FaWh1OGV2aHlBbHJSTVg3VnBJcFhlWEI0WWE5cm1ZcGVpRER3ZlVCUW5GZ1VBJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=79253776536&zc=0&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
    <script>
   function david(){
     window.open ("zoommtg://us04web.zoom.us/join?action=join&confid=dXNzPTAxMjBiMWVjLmtiVGcwb2Q0WHJFVS04WU54OTRFU0VFdENoZjFoMXgxSXJQUlZmb1VxQTN6UUZsU1dVZnczb2pzb09vWlg3V3hkS0V5NUlmTXgyblM1NVdWNXFlQmpRJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=75415279918&zc=0&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
    <script>
   function oriol(){
     window.open ("zoommtg://us02web.zoom.us/join?action=join&confid=dXNzPTA0MTIwMjM2LkNwSlJlYTN6aGVINGUtWVl5UzhUWlJobTBBQUNJeVZHNHlBR2EtNUpuM3UzTmdORjY4ajNmb2JFRDZsazR1dHFrMENxdHJXQi0xczhpR3FKNU56QUVnJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=7157577128&zc=0&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
    <script>
   function monica(){
     window.open ("zoommtg://us04web.zoom.us/join?action=join&confid=dXNzPWIxMDUzOWFmLms3YVdmV3lTQWRCSlJsaTRLZXY2OWlmeHFNd0w3Qk1jQkhUQ1NIamk1U3NMTVBuVFg4Z3ZjcklUVENXTWZuRjBFdU80RXhRNjBvZWRPUFF6SEY1TXFBJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=5407197992&zc=0&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
    <script>
   function nuria(){
     window.open ("zoommtg://zoom.us/join?action=join&confid=dXNzPTU1MDE3MmEwLmpDUzdhTEV3RjlXenp3Z3p0QlN4VDAyblpwQ0haQTB0ZHJrWkJDV1VMUy1VWWhlYUI4MXlpMmtWNnJvb3U2QUhqWjRiUkNTQmVJVzkyT254Y1doWE5RJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=8019884411&zc=0&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
    <script>
   function angels(){
     window.open ("zoommtg://us04web.zoom.us/join?action=join&confid=dXNzPTQ1YzRlYmJiLnNCcTdnTk5XbENmWnhiWnlaNkg5Rm9LVG5zNjA3SDE1V2oyRjNIdmM1enJBSmlxdG81bGthWWJ5MjNoRGpUZW9EbXI2R1RzbTN1U1FSSUdIRy1UekRnJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=2656344523&zc=0&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
    <script>
   function gemma(){
     window.open ("zoommtg://zoom.us/join?action=join&confid=dXNzPWM5ZDRlZWRhLmF3WWExa0hkOEluX01lbEZ3VWxxNEJSZjB3RWFNTzlidlVxaHJiR3hybU5uSFlSQlR5YlNhR0JGN0hXblpXZFJZTlhkaWU5VlRQQi1OSUlid2tmSnRBJTNEJTNEJnRpZD02NmRlMDAwMjZkMTk0YTFjODU3ZTRkYThmNmMzZWExMQ%3D%3D&confno=91717801480&zc=0&pwd=eG50ZXNNaXNKV0dKdU9XSmNQWHhQQT09&pk=&mcv=0.92.11227.0929&browser=chrome");
   }
    </script>
<style>
    .texto {
        color: transparent
    }
    .center {
        text-align: center


    }
     .center2 {
        align-content: center


    }
.grid-container {
  display: grid;
  grid-template-columns: auto auto auto;
  background-color: #ffffff;
  padding: 5px;
     width: 1800px;
  height: 500px;
  text-align: center
}
    .rcorners2 {
    display: grid;
  grid-template-columns: auto auto auto;
  background-color: #ffffff;
 border-radius: 25px;
  padding: 5px; 
  width: 1800px;
  height: 500px;
  text-align: center
}
.grid-item {
  background-color: rgba(255, 255, 255, 0.8);
  border: 5px solid rgba(29, 126, 245, 1);
  padding: 10px;
  font-size: 30px;
  align-content: center;

}
</style>
    <title>Zoom launcher</title>
    <div class="center">
         <img src="https://drive.google.com/uc?id=1YWmbAP9ZL2-xnUmCwsNe5OPtXeOdr86w" width="793" height="268">

        </div>

</head>
<body>


<div class="center2">
<div class="grid-container">
  <div class="grid-item" onclick="monica()">
   <img src="https://drive.google.com/uc?id=119Q8P7CAM6sDI25UCfzd8vPF2L3JBtcn" width="1800" height="500"> 
  </div>
  <div class="grid-item" onclick="jordi()">
   <img src="https://drive.google.com/uc?id=17gz7QjQca1BjPrCz0mUSn0rZa5lGzjUF" width="1800" height="500"> 
  </div> <div class="grid-item" onclick="david()">
   <img src="https://drive.google.com/uc?id=1I8xSEwoCJ1jRbY--juF7EnuRTIYbZIlo" width="1800" height="500"> 
  </div> <div class="grid-item" onclick="manoli()">
   <img src="https://drive.google.com/uc?id=1JiqSg5spgzSNmBXdqkGYaFZpdCwghmGW" width="1800" height="500"> 
  </div> <div class="grid-item" onclick="nuria()">
   <img src="
https://drive.google.com/uc?id=1Z9NBW0V7WZYe6YfVXeg0wfY15bpTzP0Q" width="1800" height="500"> 
  </div> <div class="grid-item" onclick="gemma()">
   <img src="https://drive.google.com/uc?id=1he58z7bKWPghRHiSbdHAeQWYNj7lI66J" width="1800" height="500"> 
    </div> <div class="grid-item" onclick="oriol()">
   <img src="https://drive.google.com/uc?id=1ni3jw7O8C5fUBYWDh7op4SiJEhkNESkW" width="1800" height="500"> 
  </div>
     <div class="grid-item" onclick="angels()">
   <img src="https://drive.google.com/uc?id=1wp3_nwK62VbJEo7DI4EbR7K6DOjnLdgQ" width="1800" height="500"> 
  </div>
     <div class="grid-item" onclick="zoomother()">
   <img src="https://drive.google.com/uc?id=1WgXycW_gbPJ1nhgq0OicnajEzaoMHAX6" width="1800" height="500"> 

  </div>
</div>
    </div>

</body>
</html>

谢谢

如何使HTML的大小适应屏幕大小？

0 个答案: