diff --git a/src/containers/App/App.css b/src/containers/App/App.css
index 09b7cd108653658e5bd21a3c1bea04ab4ed0511f..1340f2b6a460e020ed1876d4f38a3dda8c30c7fb 100644
--- a/src/containers/App/App.css
+++ b/src/containers/App/App.css
@@ -326,7 +326,7 @@ footer a:hover {
   background-position: center;   /* 居中对齐背景图片 */
   background-repeat: no-repeat;  /* 防止背景图片重复 */
   background-attachment: fixed;  /* 固定背景图片，使其在滚动时不移动 */
-
+  position: relative;
 }
 .custom-header-software {
   width: 100vw;
@@ -349,6 +349,13 @@ footer a:hover {
 
 }
 
+.header-bar {
+  position:absolute;
+  width: 100vw;
+  height: 100vh;
+  margin-bottom: 0px;
+}
+
 .promotion-video {
   width: 100%;
   height: 50vh; /* 设置高度为视口高度的80% */
diff --git a/src/contents/safety.tsx b/src/contents/safety.tsx
index d93a22e23aed76a6e54d682cc5fd45ec26a5bd01..c9dd00dda718f328a1510abe969bd3d65b31250f 100644
--- a/src/contents/safety.tsx
+++ b/src/contents/safety.tsx
@@ -46,13 +46,22 @@ export function Safety() {
   return (
     <>
     <div className="custom-header-safety">
-<h1 className="centered-title">
+
               <img 
-                src="https://static.igem.wiki/teams/5378/header/safety.png"
+                src="https://static.igem.wiki/teams/5378/header/header.png"
                 alt="safety header"
-                className="header-img"
+                className="header-bar"
               />
+
+<h1 className="centered-title">
+  
+  <img 
+    src="https://static.igem.wiki/teams/5378/header/safety.png"
+    alt="safety header"
+    className="header-img"
+  />
 </h1>
+
 </div>
       <div className="row  bg-rice_yellow">
         <div className="col-3">