瀏覽代碼

內容更新

jeter20131220 3 年之前
父節點
當前提交
2ee711a53c
共有 7 個文件被更改,包括 160 次插入4 次删除
  1. 1 0
      NFTContent.json
  2. 二進制
      img/sec01-v1.mp4
  3. 二進制
      img/sec01-v2.mp4
  4. 33 3
      index.html
  5. 71 0
      style.css
  6. 0 0
      style.css.map
  7. 55 1
      style.scss

+ 1 - 0
NFTContent.json

@@ -1,4 +1,5 @@
 [
+ 
     {
       
         "newsimg": "img/sec01/bwayio.jpg",

二進制
img/sec01-v1.mp4


二進制
img/sec01-v2.mp4


+ 33 - 3
index.html

@@ -281,11 +281,38 @@
             <h1>NEWS</h1>
         </div>
         <div id="sec01-container" class="container-fluid">
-
+            <div id="sec01-container-viedeo" class="row">
+                <div class="card col-lg-6"> 
+                    <video controls>
+                        <source src="./img/sec01-v1.mp4" type="video/mp4">
+                      </video>
+                    <div class="row"> 
+                            <div class="col-12"> 
+                                <a href="" target="_blank"> 
+                                    <p style=" font-weight: 900; font-size: 22px;">~數字藝術品亮相淘寶造物節!設計師黃河山協同NEAR發布出售“房地產”NFT~</p> 
+                                </a> 
+                                <p>2021年7月17日~25日,一年一度的淘寶造物節將在上海國家會展中心震撼上演。作為年輕人創意的聚集地,本次造物節將再度為大家獻上諸多意想不到的腦洞神器,其中一直為許多潮流玩家所熱捧的NFT數字藝術品也將首次亮相淘寶造物節。</p> 
+                            </div> 
+                    </div> 
+                </div>
+                <div class="card col-lg-6"> 
+                    <video controls>
+                        <source src="./img/sec01-v2.mp4" type="video/mp4">
+                      </video>
+                    <div class="row"> 
+                            <div class="col-12"> 
+                                <a href="" target="_blank"> 
+                                    <p style=" font-weight: 900; font-size: 22px;">社區生態| 孫宇晨:藝術市場的未來屬於NFT先鋒藝術家</p> 
+                                </a> 
+                                <p>7月15日,波場TRON創始人兼BitTorrent CEO孫宇晨受邀出席了佳士得第四屆“Art + Tech”峰會,在活動首個環節的圓桌訪談時孫宇晨表示,藝術市場的未來屬於NFT先鋒藝術家,當前區塊鏈實現了技術與藝術之間前所未有的聯繫,以NFT為主要代表,正在重塑藝術世界。</p> 
+                            </div> 
+                    </div> 
+                </div>
+            </div>
             <div id="sec01-container-card" class="row"></div>
         </div>
     </section>
-    <!-- 影片區塊 -->
+   
     
     <!-- 廣告區塊 -->
     <section id="sec-adv">
@@ -306,6 +333,7 @@
     <!-- <section id="video" class="container-fluid" style="padding:1vw 0;">
         <video   type="video/mp4" src="./img/video1.mp4" controls></video>
     </section> -->
+     <!-- 影片區塊 -->
     <div class="wrap container-fluid" style="padding:1vw 0;">
         <div class="adv-banner">
           <video autoplay muted loop playsinline>
@@ -4020,6 +4048,8 @@
             });
         });
     </script>
+    <!-- sec01-viedeo -->
+   
     <!-- sec01news -->
     <script>
         $(document).ready(function () {
@@ -4052,7 +4082,7 @@
                                 </div> \
                             </div>';
 
-                    }
+                    }3
                     $('#sec01-container-card').html(sec01News);
                     // var test = msg[0].newstext1;
 

+ 71 - 0
style.css

@@ -608,6 +608,77 @@ body .learn-more:hover {
   }
 }
 
+#sec01-container-viedeo .card {
+  padding: 30px;
+  border: none !important;
+}
+
+@media screen and (max-width: 767px) {
+  #sec01-container-viedeo .card {
+    padding: 15px;
+  }
+}
+
+#sec01-container-viedeo .card h1 {
+  padding: 15px;
+  font-size: 40px;
+  font-weight: 900;
+  color: #9b9b9b;
+}
+
+#sec01-container-viedeo .card p {
+  padding: 5px;
+  font-size: 18px;
+  margin-bottom: 0 !important;
+}
+
+@media screen and (max-width: 767px) {
+  #sec01-container-viedeo .card p {
+    padding: 0px;
+    font-size: 16px;
+  }
+}
+
+#sec01-container-viedeo .card .sec01-title {
+  padding: 15px 0px;
+  font-weight: 900;
+  font-size: 22px;
+}
+
+@media screen and (max-width: 767px) {
+  #sec01-container-viedeo .card .sec01-title {
+    font-size: 18px;
+  }
+}
+
+#sec01-container-viedeo .card a {
+  text-decoration: none;
+  color: #000;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+  cursor: pointer;
+}
+
+#sec01-container-viedeo .card a:hover {
+  color: #2828ff;
+}
+
+#sec01-container-viedeo .card img {
+  text-align: center;
+  width: 35vw;
+  height: 240px;
+  -o-object-fit: cover;
+     object-fit: cover;
+}
+
+@media screen and (max-width: 767px) {
+  #sec01-container-viedeo .card img {
+    width: 85vw;
+    height: 200px;
+    margin: 0 auto;
+  }
+}
+
 #sec01 {
   padding-top: 5vw;
 }

文件差異過大導致無法顯示
+ 0 - 0
style.css.map


+ 55 - 1
style.scss

@@ -473,7 +473,61 @@ body {
         }
     }
 }
-
+// sec01 video
+#sec01-container-viedeo{
+    
+        .card {
+            padding: 30px;
+            border: none !important;
+            @media screen and(max-width:$moblie) {
+                padding: 15px;
+            }
+            h1 {
+                padding: 15px;
+                font-size: 40px;
+                font-weight: 900;
+                color: #9b9b9b;
+            }
+            p {
+                padding: 5px;
+                font-size: 18px;
+                margin-bottom: 0 !important;
+                @media screen and(max-width:$moblie) {
+                    padding: 0px;
+                    font-size: 16px;
+                }
+            }
+            .sec01-title {
+                padding: 15px 0px;
+                font-weight: 900;
+                font-size: 22px;
+                @media screen and(max-width:$moblie) {
+                    font-size: 18px;
+                }
+            }
+            a {
+                text-decoration: none;
+                color: #000;
+                transition: 0.3s;
+                cursor: pointer;
+                &:hover {
+                    color: #2828ff;
+                }
+            }
+            img {
+                text-align: center;
+                width: 35vw;
+                height: 240px;
+                object-fit: cover;
+                @media screen and(max-width:$moblie) {
+                    width: 85vw;
+                    height: 200px;
+                    margin: 0 auto;
+                }
+            }
+        }
+    
+}
 // sec01 NEWS
 #sec01 {
     padding-top: 5vw;

部分文件因文件數量過多而無法顯示