Просмотр исходного кода

fix: ContactUs 响应式图片显示修复及样式调整

nahida 4 месяцев назад
Родитель
Сommit
d6a5ab9ea6
1 измененных файлов с 7 добавлено и 7 удалено
  1. 7 7
      src/components/about/ContactUs.tsx

+ 7 - 7
src/components/about/ContactUs.tsx

@@ -43,24 +43,24 @@ function ContactUs({basicInfo, locationInfoList}: { basicInfo: BasicInfo, locati
   return (
     <>
       {/* 联系我们 */}
-      <section id="section-4" className="w-4/5 mx-auto scroll-mt-10 py-12 px-4">
-        <div className="my-10 sm:my-6">
+      <section id="section-4" className="scroll-mt-10 py-12 px-4">
+        <div className="w-4/5 mx-auto my-10 sm:my-6">
           <SubTitle title="联系我们"/>
         </div>
-        <div className="w-full">
+        <div className="w-full sm:w-[80%] mx-auto">
           <Image
-            src="/assets/about/24.jpg"
+            src="/assets/about/25.jpg"
             alt="contact"
             width={1000}
             height={1000}
-            className="w-full h-auto block sm:block"
+            className="w-full h-auto block sm:hidden"
           />
           <Image
-            src="/assets/about/25.jpg"
+            src="/assets/about/24.jpg"
             alt="contact"
             width={1000}
             height={1000}
-            className="w-full h-auto hidden sm:hidden"
+            className="w-full h-auto hidden sm:block"
           />
         </div>
         {/* <div className="grid sm:grid-cols-1 md:grid-cols-2 gap-6">