Главная Обзор Помощь
Регистрация Вход
choozmo
/
OpenTalk
2
0
Ответвить 0
Файлы Задачи 0 Запросы на слияние 0 Вики
Просмотр исходного кода

Merge branch 'master' of http://git.choozmo.com:3000/choozmo/OpenTalk

ming 3 лет назад
Родитель
692622b09e 13334cbaad
Сommit
417469ae6f
5 измененных файлов с 192 добавлено и 0 удалено
Разделённый вид Показать статистику Diff
  1. 1 0
      README.md
  2. 41 0
      index.html
  3. 77 0
      style.css
  4. 9 0
      style.css.map
  5. 64 0
      style.scss

+ 1 - 0
README.md
Просмотреть файл 

@@ -0,0 +1 @@
 
+# opentalk

+ 41 - 0
index.html
Просмотреть файл 

@@ -0,0 +1,41 @@
 
+<!DOCTYPE html>
 
+<html lang="zh">
 
+
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>opentalk</title>
 
+
 
+    <link rel="stylesheet" href="./style.css">
 
+</head>
 
+
 
+<body>
 
+   <section id="banner">
 
+
 
+   </section>
 
+   <section class="marquee">
 
+    <div id="marquee-box">
 
+        <span class="span">Lorem ipsum dolor sit amet consectetur adipisicing elit. </span>
 
+        <span class="span">Lorem ipsum dolor sit amet consectetur adipisicing elit. </span>
 
+      </div>
 
+   </section>
 
+   <section id="tag">
 
+       <button class="btn" id="1">Lorem</button>
 
+       <button class="btn" id="2">Lorem</button>
 
+       <button class="btn" id="3">Lorem</button>
 
+       <button class="btn" id="4">Lorem</button>
 
+       <button class="btn" id="5">Lorem</button>
 
+   </section>
 
+   <section id="Search-result">
 
+       <div class="result-box">
 
+        <img src="https://fakeimg.pl/300x200/">
 
+        <div class="result-box">
 
+            <h1>朋友圈吸金實戰課</h1>
 
+            <p>酷奇文化11111</p>
 
+        </div>
 
+       </div>
 
+   </section>
 
+</body>
 
+
 
+</html>

+ 77 - 0
style.css
Просмотреть файл 

@@ -0,0 +1,77 @@
 
+* {
 
+  margin: 0;
 
+  padding: 0;
 
+  -webkit-box-sizing: border-box;
 
+          box-sizing: border-box;
 
+}
 
+
 
+body {
 
+  height: 3000px;
 
+}
 
+
 
+#banner {
 
+  width: 100vw;
 
+  height: 500px;
 
+  background-image: url("https://fakeimg.pl/1650x600/");
 
+  background-size: cover;
 
+  background-repeat: no-repeat;
 
+  background-position: 40% 50%;
 
+}
 
+
 
+.marquee {
 
+  margin: 100px auto;
 
+  height: 100px;
 
+  width: 1000px;
 
+  overflow: hidden;
 
+  position: relative;
 
+  font-size: 48px;
 
+}
 
+
 
+.marquee #marquee-box {
 
+  display: block;
 
+  width: 200%;
 
+  height: 75px;
 
+  position: absolute;
 
+  overflow: hidden;
 
+  -webkit-animation: marquee 5s linear infinite;
 
+          animation: marquee 5s linear infinite;
 
+}
 
+
 
+.marquee #marquee-box .span {
 
+  float: left;
 
+  width: 50%;
 
+}
 
+
 
+@-webkit-keyframes marquee {
 
+  0% {
 
+    left: 0;
 
+  }
 
+  100% {
 
+    left: -100%;
 
+  }
 
+}
 
+
 
+@keyframes marquee {
 
+  0% {
 
+    left: 0;
 
+  }
 
+  100% {
 
+    left: -100%;
 
+  }
 
+}
 
+
 
+#tag {
 
+  width: 100vw;
 
+  text-align: center;
 
+}
 
+
 
+#tag .btn {
 
+  padding: 15px;
 
+  width: 100px;
 
+  margin: 30px;
 
+  background-color: #CE0000;
 
+  font-size: 24px;
 
+  color: #fff;
 
+  border: none;
 
+}
 
+/*# sourceMappingURL=style.css.map */

+ 9 - 0
style.css.map
Просмотреть файл 

@@ -0,0 +1,9 @@
 
+{
 
+    "version": 3,
 
+    "mappings": "AAAA,AAAA,CAAC,CAAC;EACE,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EACV,UAAU,EAAE,UAAU;CACzB;;AACD,AAAA,IAAI,CAAC;EACD,MAAM,EAAE,MAAM;CACjB;;AAED,AAAA,OAAO,CAAC;EACJ,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;EACb,gBAAgB,EAAE,mCAAmC;EACrD,eAAe,EAAE,KAAK;EACtB,iBAAiB,EAAE,SAAS;EAC5B,mBAAmB,EAAE,OAAO;CAC/B;;AACD,AAAA,QAAQ,CAAC;EACL,MAAM,EAAE,UAAU;EAClB,MAAM,EAAE,KAAK;EACb,KAAK,EAAE,MAAM;EACb,QAAQ,EAAE,MAAM;EAChB,QAAQ,EAAE,QAAQ;EAClB,SAAS,EAAE,IAAI;CAqBlB;;AA3BD,AAOI,QAPI,CAOJ,YAAY,CAAC;EACT,OAAO,EAAE,KAAK;EACd,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,QAAQ,EAAE,QAAQ;EAClB,QAAQ,EAAE,MAAM;EAChB,SAAS,EAAE,0BAA0B;CAaxC;;AA1BL,AAcQ,QAdA,CAOJ,YAAY,CAOR,KAAK,CAAC;EACF,KAAK,EAAE,IAAI;EACX,KAAK,EAAE,GAAG;CACb;;AACD,UAAU,CAAV,OAAU;EACN,EAAE;IACE,IAAI,EAAE,CAAC;;EAEX,IAAI;IACA,IAAI,EAAE,KAAK;;;;AAM3B,AAAA,IAAI,CAAA;EACA,KAAK,EAAE,KAAK;EACZ,UAAU,EAAE,MAAM;CAUrB;;AAZD,AAGI,IAHA,CAGA,IAAI,CAAA;EACJ,OAAO,EAAE,IAAI;EACb,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,IAAI;EACZ,gBAAgB,EAAC,OAAO;EACxB,SAAS,EAAE,IAAI;EACf,KAAK,EAAC,IAAI;EACV,MAAM,EAAE,IAAI;CACX",
 
+    "sources": [
 
+        "style.scss"
 
+    ],
 
+    "names": [],
 
+    "file": "style.css"
 
+}

+ 64 - 0
style.scss
Просмотреть файл 

@@ -0,0 +1,64 @@
 
+* {
 
+    margin: 0;
 
+    padding: 0;
 
+    box-sizing: border-box;
 
+}
 
+body {
 
+    height: 3000px;
 
+}
 
+
 
+#banner {
 
+    width: 100vw;
 
+    height: 500px;
 
+    background-image: url("https://fakeimg.pl/1650x600/");
 
+    background-size: cover;
 
+    background-repeat: no-repeat;
 
+    background-position: 40% 50%;
 
+}
 
+.marquee {
 
+    margin: 100px auto;
 
+    height: 100px;
 
+    width: 1000px;
 
+    overflow: hidden;
 
+    position: relative;
 
+    font-size: 48px;
 
+    #marquee-box {
 
+        display: block;
 
+        width: 200%;
 
+        height: 75px;
 
+        position: absolute;
 
+        overflow: hidden;
 
+        animation: marquee 5s linear infinite;
 
+        .span {
 
+            float: left;
 
+            width: 50%;
 
+        }
 
+        @keyframes marquee {
 
+            0% {
 
+                left: 0;
 
+            }
 
+            100% {
 
+                left: -100%;
 
+            }
 
+        }
 
+    }
 
+}
 
+
 
+#tag{
 
+    width: 100vw;
 
+    text-align: center;
 
+    .btn{
 
+    padding: 15px;
 
+    width: 100px;
 
+    margin: 30px;
 
+    background-color:#CE0000;
 
+    font-size: 24px;
 
+    color:#fff;
 
+    border: none;
 
+    }
 
+}
 
+#Search-result{
 
+    .result-box{
 
+        
+    }
 
+}