From 3e14344461a29ec09d24864cafaa516d49d48dde Mon Sep 17 00:00:00 2001
From: AviderMin <gms2917466108@163.com>
Date: Wed, 30 Oct 2024 18:35:54 +0800
Subject: [PATCH] =?UTF-8?q?fix=E6=96=B0=E9=97=BB=E6=8A=A5=E9=81=93?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 WebNews/css/foucsreport.css |  7 +++-
 WebNews/foucsreport.html    | 73 +++++++++++++++++++++++++++++--------
 2 files changed, 63 insertions(+), 17 deletions(-)

diff --git a/WebNews/css/foucsreport.css b/WebNews/css/foucsreport.css
index 1d4b009..e4a6eb2 100644
--- a/WebNews/css/foucsreport.css
+++ b/WebNews/css/foucsreport.css
@@ -16,17 +16,20 @@
 
 }
 .reportbox{
-    width: 30%;
+    width: 33%;
     margin-top: 20px;
+    display: inline-block;
 }
 .boxtitle{
     height: 40px;
     background-color: skyblue;
     font-size: 18px;
+    line-height: 40px;
+    text-align: center;
 
 }
 .boxcover img{
-    width: 294px;
+    width: 100%;
     height:210px;
     overflow: hidden;
 }
diff --git a/WebNews/foucsreport.html b/WebNews/foucsreport.html
index 390a94c..5752033 100644
--- a/WebNews/foucsreport.html
+++ b/WebNews/foucsreport.html
@@ -64,21 +64,64 @@
 
     </div>
     <div class="footer">web新闻网站</div>
-    <script>
-        let totalHight;
-        let Prostick; 
-
-        document.addEventListener("DOMContentLoaded", function () {
-            
-
-            
-            Prostick = document.querySelector('.Prostick'); 
-            totalHight = document.body.scrollHeight - window.innerHeight; 
-        });
-        window.addEventListener('scroll', function () {
-            let pro = (window.pageYOffset / totalHight) * 100;
-            Prostick.style.width = pro + '%';
-        })
+    <script>  
+        let totalHeight;  
+        let Prostick;  
+  
+        document.addEventListener("DOMContentLoaded", function () {  
+            let boxTitle = [  
+                { text: "新闻示例1" },  
+                { text: "新闻示例2" },  
+                { text: "新闻示例3" },  
+                { text: "新闻示例4" },  
+                { text: "新闻示例5" },  
+                { text: "新闻示例6" },  
+            ];  
+            let boxCover = [  
+                { src: "path/to/image1.jpg" },  
+                { src: "path/to/image2.jpg" },  
+                { src: "path/to/image3.jpg" },  
+                { src: "path/to/image4.jpg" },  
+                { src: "path/to/image5.jpg" },  
+                { src: "path/to/image6.jpg" },  
+            ];  
+            let boxInfo = [  
+                { text: "示例文本..." },  
+                { text: "示例文本..." },  
+                { text: "示例文本..." },  
+                { text: "示例文本..." },  
+                { text: "示例文本..." },  
+                { text: "示例文本..." },  
+            ];  
+  
+            const reportBoxes = document.querySelectorAll('.reportbox');  
+  
+            reportBoxes.forEach((box, index) => {  
+                const boxTitleContent = box.querySelector('.boxtitle');  
+                const boxCoverContent = box.querySelector('.boxcover');  
+                const boxInfoContent = box.querySelector('.boxinfo');  
+  
+                const h3 = document.createElement('h3');  
+                h3.textContent = boxTitle[index].text;  
+                boxTitleContent.appendChild(h3);  
+  
+                const img = document.createElement('img');  
+                img.src = boxCover[index].src;  
+                boxCoverContent.appendChild(img);  
+  
+                const p = document.createElement('p');  
+                p.textContent = boxInfo[index].text;  
+                boxInfoContent.appendChild(p);  
+            });  
+  
+            Prostick = document.querySelector('.Prostick');  
+            totalHeight = document.body.scrollHeight - window.innerHeight;  
+        });  
+  
+        window.addEventListener('scroll', function () {  
+            let pro = (window.pageYOffset / totalHeight) * 100;  
+            Prostick.style.width = pro + '%';  
+        });  
     </script>
 </body>
 </html>
\ No newline at end of file