Начало Каталог Помощ
Вход
lovecoding
/
Web1020
10
0
Разклонения 0
Файлове Задачи 0 Заявки за сливане 0 Уики
Преглед на файлове

js基础

e преди 5 месеца
родител
3fce5f16d5
ревизия
5d8a0b064a
променени са 71 файла, в които са добавени 1144 реда и са изтрити 476 реда
Разделен изглед Покажи статистика за разликите
  1. 0 476
      day4/index.html
  2. 0 0
      html+css/day1/html/demo.html
  3. 0 0
      html+css/day1/html/文档流.html
  4. 0 0
      html+css/day1/html/标签.html
  5. 0 0
      html+css/day1/images/1.jpg
  6. 0 0
      html+css/day1/笔记.md
  7. 0 0
      html+css/day2/1.表单.html
  8. 0 0
      html+css/day2/2.表格.html
  9. 0 0
      html+css/day2/3.引入css.html
  10. 0 0
      html+css/day2/4.常用样式.html
  11. 0 0
      html+css/day2/5.文字样式.html
  12. 0 0
      html+css/day2/6.样式.html
  13. 0 0
      html+css/day2/demo.html
  14. 0 0
      html+css/day2/img01.gif
  15. 0 0
      html+css/day2/index.css
  16. 0 0
      html+css/day3/1.选择器.html
  17. 0 0
      html+css/day3/2.选择器的优先级.html
  18. 0 0
      html+css/day3/3.盒模型.html
  19. 0 0
      html+css/day3/4.padding-margin.html
  20. 0 0
      html+css/day3/5.浮动.html
  21. 0 0
      html+css/day3/6.解决浮动问题.html
  22. 0 0
      html+css/day3/7.轮廓.html
  23. 0 0
      html+css/day3/demo/images/1.png
  24. 0 0
      html+css/day3/demo/images/2.png
  25. 0 0
      html+css/day3/demo/images/3.png
  26. 0 0
      html+css/day3/demo/images/4.png
  27. 0 0
      html+css/day3/demo/images/5.png
  28. 0 0
      html+css/day3/demo/images/star.png
  29. 0 0
      html+css/day3/demo/index.css
  30. 0 0
      html+css/day3/demo/index.html
  31. 0 0
      html+css/day4/font/demo.css
  32. 0 0
      html+css/day4/font/demo_index.html
  33. 0 0
      html+css/day4/font/iconfont.css
  34. 0 0
      html+css/day4/font/iconfont.js
  35. 0 0
      html+css/day4/font/iconfont.json
  36. 0 0
      html+css/day4/font/iconfont.ttf
  37. 0 0
      html+css/day4/font/iconfont.woff
  38. 0 0
      html+css/day4/font/iconfont.woff2
  39. 0 0
      html+css/day4/images/1.jpg
  40. 0 0
      html+css/day4/images/2.jpg
  41. 0 0
      html+css/day4/images/3.jpg
  42. 0 0
      html+css/day4/images/4.jpg
  43. 0 0
      html+css/day4/images/5.jpg
  44. 0 0
      html+css/day4/images/6.jpg
  45. 0 0
      html+css/day4/images/7.jpg
  46. 0 0
      html+css/day4/images/banner.avif
  47. 0 0
      html+css/day4/images/banner.png
  48. 0 0
      html+css/day4/images/down.png
  49. 0 0
      html+css/day4/images/logo.png
  50. 0 0
      html+css/day4/images/search.png
  51. 0 0
      html+css/day4/images/type.png
  52. 0 0
      html+css/day4/index.css
  53. 500 0
      html+css/day4/index.html
  54. BIN
      html+css/day5/demo/images/1.jpg
  55. BIN
      html+css/day5/demo/images/bannerjpg.jpg
  56. BIN
      html+css/day5/demo/images/newIndex-searchBtn.png
  57. BIN
      html+css/day5/demo/images/soso.png
  58. 186 0
      html+css/day5/demo/index.css
  59. 84 0
      html+css/day5/demo/index.html
  60. 0 0
      html+css/day5/定位.html
  61. 230 0
      html+css/包图网/demo.css
  62. 79 0
      html+css/包图网/demo.html
  63. BIN
      html+css/包图网/images/LOGO.png
  64. BIN
      html+css/包图网/images/banner.png
  65. BIN
      html+css/包图网/images/hot.png
  66. BIN
      html+css/包图网/images/new.png
  67. BIN
      html+css/包图网/images/shop.png
  68. 2 0
      js/js基础/1.js
  69. 23 0
      js/js基础/1.js的引入.html
  70. 2 0
      js/js基础/2.js
  71. 38 0
      js/js基础/2.变量.html

+ 0 - 476
day4/index.html
Целия файл 

@@ -1,476 +0,0 @@
 
-<!DOCTYPE html>
 
-<html lang="en">
 
-  <head>
 
-    <meta charset="UTF-8" />
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-    <title>Document</title>
 
-    <link rel="stylesheet" href="./index.css" />
 
-    <link rel="stylesheet" href="./font/iconfont.css" />
 
-  </head>
 
-  <body>
 
-    <div id="box">
 
-      <div id="header">
 
-        <div class="container">
 
-          <div class="left">
 
-            <img src="./images/logo.png" alt="" />
 
-            <div class="address">
 
-              <span class="iconfont icon-dizhiguanli"></span>
 
-              <span class="city">北京</span>
 
-              <img src="./images/down.png" alt="" />
 
-            </div>
 
-            <div class="nav">
 
-              <a href="">首页</a>
 
-              <a href="">分类</a>
 
-            </div>
 
-          </div>
 
-          <div class="right">
 
-            <div class="search">
 
-              <div class="logo">
 
-                <img src="./images/search.png" alt="" />
 
-              </div>
 
-              <input type="text" placeholder="搜索明星、演出、体育赛事" />
 
-              <div class="btn">搜索</div>
 
-            </div>
 
-            <div class="user">
 
-              <div class="my">
 
-                <span class="iconfont icon-yonghu"></span>
 
-                <span>登录</span>
 
-              </div>
 
-              <div class="download">
 
-                <span class="iconfont icon-shouji"></span>
 
-                <span>下载</span>
 
-              </div>
 
-            </div>
 
-          </div>
 
-        </div>
 
-      </div>
 
-      <div id="main">
 
-        <div class="container">
 
-          <!-- 轮播图 -->
 
-          <div class="banner">
 
-            <img src="./images/banner.png" alt="" />
 
-          </div>
 
-          <!-- 演出类型 -->
 
-          <div class="type">
 
-            <ul>
 
-              <li>
 
-                <div></div>
 
-                <a href="">演唱会</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">话剧歌剧</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">体育</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">儿童亲子</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">展览休闲</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">音乐会</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">曲苑杂坛</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">舞蹈芭蕾</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">二次元</a>
 
-              </li>
 
-              <li>
 
-                <div></div>
 
-                <a href="">旅游展览</a>
 
-              </li>
 
-            </ul>
 
-          </div>
 
-          <!-- 演唱会 -->
 
-          <div class="concert">
 
-            <div class="content">
 
-              <div class="top">
 
-                <div class="title">演唱会</div>
 
-                <div class="more">查看全部</div>
 
-              </div>
 
-              <div class="bottom">
 
-                <div class="left">
 
-                    <img src="./images/1.jpg" alt="">
 
-                </div>
 
-                <div class="right">
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/2.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/3.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/4.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/5.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/6.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/7.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-          </div>
 
-          <div class="concert">
 
-            <div class="content">
 
-              <div class="top">
 
-                <div class="title">演唱会</div>
 
-                <div class="more">查看全部</div>
 
-              </div>
 
-              <div class="bottom">
 
-                <div class="left">
 
-                    <img src="./images/1.jpg" alt="">
 
-                </div>
 
-                <div class="right">
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/2.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/3.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/4.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/5.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/6.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/7.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-          </div>
 
-          <div class="concert">
 
-            <div class="content">
 
-              <div class="top">
 
-                <div class="title">演唱会</div>
 
-                <div class="more">查看全部</div>
 
-              </div>
 
-              <div class="bottom">
 
-                <div class="left">
 
-                    <img src="./images/1.jpg" alt="">
 
-                </div>
 
-                <div class="right">
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/2.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/3.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/4.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/5.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/6.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/7.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-          </div>
 
-          <div class="concert">
 
-            <div class="content">
 
-              <div class="top">
 
-                <div class="title">演唱会</div>
 
-                <div class="more">查看全部</div>
 
-              </div>
 
-              <div class="bottom">
 
-                <div class="left">
 
-                    <img src="./images/1.jpg" alt="">
 
-                </div>
 
-                <div class="right">
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/2.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/3.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/4.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/5.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/6.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                    <div class="listItems">
 
-                        <div class="pictures">
 
-                            <img src="./images/7.jpg" alt="">
 
-                        </div>
 
-                        <div class="word">
 
-                            <div class="tips">2024黄义达20周年  “Set Me Free(放我自由)”个人演唱会-北京站</div>
 
-                            <div class="desc">M空间</div>
 
-                            <div class="date">2024.11.30 周六 19:00</div>
 
-                            <div class="price">
 
-                                ￥498<span>起</span>
 
-                            </div>
 
-                        </div>
 
-                    </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-          </div>
 
-        </div>
 
-      </div>
 
-      <div id="footer"></div>
 
-    </div>
 
-  </body>
 
-</html>

+ 0 - 0
day1/html/demo.html → html+css/day1/html/demo.html
Целия файл


+ 0 - 0
day1/html/文档流.html → html+css/day1/html/文档流.html
Целия файл


+ 0 - 0
day1/html/标签.html → html+css/day1/html/标签.html
Целия файл


+ 0 - 0
day1/images/1.jpg → html+css/day1/images/1.jpg
Целия файл


+ 0 - 0
day1/笔记.md → html+css/day1/笔记.md
Целия файл


+ 0 - 0
day2/1.表单.html → html+css/day2/1.表单.html
Целия файл


+ 0 - 0
day2/2.表格.html → html+css/day2/2.表格.html
Целия файл


+ 0 - 0
day2/3.引入css.html → html+css/day2/3.引入css.html
Целия файл


+ 0 - 0
day2/4.常用样式.html → html+css/day2/4.常用样式.html
Целия файл


+ 0 - 0
day2/5.文字样式.html → html+css/day2/5.文字样式.html
Целия файл


+ 0 - 0
day2/6.样式.html → html+css/day2/6.样式.html
Целия файл


+ 0 - 0
day2/demo.html → html+css/day2/demo.html
Целия файл


+ 0 - 0
day2/img01.gif → html+css/day2/img01.gif
Целия файл


+ 0 - 0
day2/index.css → html+css/day2/index.css
Целия файл


+ 0 - 0
day3/1.选择器.html → html+css/day3/1.选择器.html
Целия файл


+ 0 - 0
day3/2.选择器的优先级.html → html+css/day3/2.选择器的优先级.html
Целия файл


+ 0 - 0
day3/3.盒模型.html → html+css/day3/3.盒模型.html
Целия файл


+ 0 - 0
day3/4.padding-margin.html → html+css/day3/4.padding-margin.html
Целия файл


+ 0 - 0
day3/5.浮动.html → html+css/day3/5.浮动.html
Целия файл


+ 0 - 0
day3/6.解决浮动问题.html → html+css/day3/6.解决浮动问题.html
Целия файл


+ 0 - 0
day3/7.轮廓.html → html+css/day3/7.轮廓.html
Целия файл


+ 0 - 0
day3/demo/images/1.png → html+css/day3/demo/images/1.png
Целия файл


+ 0 - 0
day3/demo/images/2.png → html+css/day3/demo/images/2.png
Целия файл


+ 0 - 0
day3/demo/images/3.png → html+css/day3/demo/images/3.png
Целия файл


+ 0 - 0
day3/demo/images/4.png → html+css/day3/demo/images/4.png
Целия файл


+ 0 - 0
day3/demo/images/5.png → html+css/day3/demo/images/5.png
Целия файл


+ 0 - 0
day3/demo/images/star.png → html+css/day3/demo/images/star.png
Целия файл


+ 0 - 0
day3/demo/index.css → html+css/day3/demo/index.css
Целия файл


+ 0 - 0
day3/demo/index.html → html+css/day3/demo/index.html
Целия файл


+ 0 - 0
day4/font/demo.css → html+css/day4/font/demo.css
Целия файл


+ 0 - 0
day4/font/demo_index.html → html+css/day4/font/demo_index.html
Целия файл


+ 0 - 0
day4/font/iconfont.css → html+css/day4/font/iconfont.css
Целия файл


+ 0 - 0
day4/font/iconfont.js → html+css/day4/font/iconfont.js
Целия файл


+ 0 - 0
day4/font/iconfont.json → html+css/day4/font/iconfont.json
Целия файл


+ 0 - 0
day4/font/iconfont.ttf → html+css/day4/font/iconfont.ttf
Целия файл


+ 0 - 0
day4/font/iconfont.woff → html+css/day4/font/iconfont.woff
Целия файл


+ 0 - 0
day4/font/iconfont.woff2 → html+css/day4/font/iconfont.woff2
Целия файл


+ 0 - 0
day4/images/1.jpg → html+css/day4/images/1.jpg
Целия файл


+ 0 - 0
day4/images/2.jpg → html+css/day4/images/2.jpg
Целия файл


+ 0 - 0
day4/images/3.jpg → html+css/day4/images/3.jpg
Целия файл


+ 0 - 0
day4/images/4.jpg → html+css/day4/images/4.jpg
Целия файл


+ 0 - 0
day4/images/5.jpg → html+css/day4/images/5.jpg
Целия файл


+ 0 - 0
day4/images/6.jpg → html+css/day4/images/6.jpg
Целия файл


+ 0 - 0
day4/images/7.jpg → html+css/day4/images/7.jpg
Целия файл


+ 0 - 0
day4/images/banner.avif → html+css/day4/images/banner.avif
Целия файл


+ 0 - 0
day4/images/banner.png → html+css/day4/images/banner.png
Целия файл


+ 0 - 0
day4/images/down.png → html+css/day4/images/down.png
Целия файл


+ 0 - 0
day4/images/logo.png → html+css/day4/images/logo.png
Целия файл


+ 0 - 0
day4/images/search.png → html+css/day4/images/search.png
Целия файл


+ 0 - 0
day4/images/type.png → html+css/day4/images/type.png
Целия файл


+ 0 - 0
day4/index.css → html+css/day4/index.css
Целия файл


+ 500 - 0
html+css/day4/index.html
Целия файл 

@@ -0,0 +1,500 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+  <head>
 
+    <meta charset="UTF-8" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+    <title>Document</title>
 
+    <link rel="stylesheet" href="./index.css" />
 
+    <link rel="stylesheet" href="./font/iconfont.css" />
 
+  </head>
 
+  <body>
 
+    <div id="box">
 
+      <div id="header">
 
+        <div class="container">
 
+          <div class="left">
 
+            <img src="./images/logo.png" alt="" />
 
+            <div class="address">
 
+              <span class="iconfont icon-dizhiguanli"></span>
 
+              <span class="city">北京</span>
 
+              <img src="./images/down.png" alt="" />
 
+            </div>
 
+            <div class="nav">
 
+              <a href="">首页</a>
 
+              <a href="">分类</a>
 
+            </div>
 
+          </div>
 
+          <div class="right">
 
+            <div class="search">
 
+              <div class="logo">
 
+                <img src="./images/search.png" alt="" />
 
+              </div>
 
+              <input type="text" placeholder="搜索明星、演出、体育赛事" />
 
+              <div class="btn">搜索</div>
 
+            </div>
 
+            <div class="user">
 
+              <div class="my">
 
+                <span class="iconfont icon-yonghu"></span>
 
+                <span>登录</span>
 
+              </div>
 
+              <div class="download">
 
+                <span class="iconfont icon-shouji"></span>
 
+                <span>下载</span>
 
+              </div>
 
+            </div>
 
+          </div>
 
+        </div>
 
+      </div>
 
+      <div id="main">
 
+        <div class="container">
 
+          <!-- 轮播图 -->
 
+          <div class="banner">
 
+            <img src="./images/banner.png" alt="" />
 
+          </div>
 
+          <!-- 演出类型 -->
 
+          <div class="type">
 
+            <ul>
 
+              <li>
 
+                <div></div>
 
+                <a href="">演唱会</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">话剧歌剧</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">体育</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">儿童亲子</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">展览休闲</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">音乐会</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">曲苑杂坛</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">舞蹈芭蕾</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">二次元</a>
 
+              </li>
 
+              <li>
 
+                <div></div>
 
+                <a href="">旅游展览</a>
 
+              </li>
 
+            </ul>
 
+          </div>
 
+          <!-- 演唱会 -->
 
+          <div class="concert">
 
+            <div class="content">
 
+              <div class="top">
 
+                <div class="title">演唱会</div>
 
+                <div class="more">查看全部</div>
 
+              </div>
 
+              <div class="bottom">
 
+                <div class="left">
 
+                  <img src="./images/1.jpg" alt="" />
 
+                </div>
 
+                <div class="right">
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/2.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/3.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/4.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/5.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/6.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/7.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                </div>
 
+              </div>
 
+            </div>
 
+          </div>
 
+          <div class="concert">
 
+            <div class="content">
 
+              <div class="top">
 
+                <div class="title">演唱会</div>
 
+                <div class="more">查看全部</div>
 
+              </div>
 
+              <div class="bottom">
 
+                <div class="left">
 
+                  <img src="./images/1.jpg" alt="" />
 
+                </div>
 
+                <div class="right">
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/2.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/3.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/4.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/5.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/6.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/7.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                </div>
 
+              </div>
 
+            </div>
 
+          </div>
 
+          <div class="concert">
 
+            <div class="content">
 
+              <div class="top">
 
+                <div class="title">演唱会</div>
 
+                <div class="more">查看全部</div>
 
+              </div>
 
+              <div class="bottom">
 
+                <div class="left">
 
+                  <img src="./images/1.jpg" alt="" />
 
+                </div>
 
+                <div class="right">
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/2.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/3.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/4.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/5.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/6.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/7.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                </div>
 
+              </div>
 
+            </div>
 
+          </div>
 
+          <div class="concert">
 
+            <div class="content">
 
+              <div class="top">
 
+                <div class="title">演唱会</div>
 
+                <div class="more">查看全部</div>
 
+              </div>
 
+              <div class="bottom">
 
+                <div class="left">
 
+                  <img src="./images/1.jpg" alt="" />
 
+                </div>
 
+                <div class="right">
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/2.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/3.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/4.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/5.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/6.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="listItems">
 
+                    <div class="pictures">
 
+                      <img src="./images/7.jpg" alt="" />
 
+                    </div>
 
+                    <div class="word">
 
+                      <div class="tips">
 
+                        2024黄义达20周年 “Set Me
 
+                        Free(放我自由)”个人演唱会-北京站
 
+                      </div>
 
+                      <div class="desc">M空间</div>
 
+                      <div class="date">2024.11.30 周六 19:00</div>
 
+                      <div class="price">￥498<span>起</span></div>
 
+                    </div>
 
+                  </div>
 
+                </div>
 
+              </div>
 
+            </div>
 
+          </div>
 
+        </div>
 
+      </div>
 
+      <div id="footer"></div>
 
+    </div>
 
+  </body>
 
+</html>

BIN
html+css/day5/demo/images/1.jpg
Целия файл


BIN
html+css/day5/demo/images/bannerjpg.jpg
Целия файл


BIN
html+css/day5/demo/images/newIndex-searchBtn.png
Целия файл


BIN
html+css/day5/demo/images/soso.png
Целия файл


+ 186 - 0
html+css/day5/demo/index.css
Целия файл 

@@ -0,0 +1,186 @@
 
+* {
 
+    margin: 0;
 
+    padding: 0;
 
+    list-style: none;
 
+    text-decoration: none;
 
+    box-sizing: border-box;
 
+}
 
+#header {
 
+    width: 100%;
 
+    height: 75px;
 
+}
 
+#header .container {
 
+    width: 1260px;
 
+    height: 100%;
 
+    margin: 0 auto;
 
+    padding-top: 14px;
 
+}
 
+#header .container .logo {
 
+    width: 149px;
 
+    height: 45px;
 
+    float: left;
 
+    background: url('./images/soso.png') 219px 62px;
 
+}
 
+#header .container .nav {
 
+    width: 352px;
 
+    height: 75px;
 
+    float: left;
 
+    margin-top: -14px;
 
+    margin-left: 30px;
 
+    position: relative;
 
+} 
+#header .container .nav ul {
 
+    overflow: hidden;
 
+}
 
+#header .container .nav ul li {
 
+    float: left;
 
+    line-height: 75px;
 
+    margin-left: 30px;
 
+}
 
+#header .container .nav ul li:first-child {
 
+    margin-left: 0;
 
+}
 
+#header .container .nav ul li a {
 
+    color: #000;
 
+    font-size: 16px;
 
+}
 
+
 
+#header .container .nav ul li:first-child a {
 
+    color: #31CCFF;
 
+}
 
+#header .container .nav ul li a:hover {
 
+    color: #31CCFF;
 
+}
 
+#header .container .nav .tips {
 
+    width: 37px;
 
+    height: 14px;
 
+    color: #999;
 
+    font-size: 12px;
 
+    text-align: center;
 
+    line-height: 14px;
 
+    background: #f5f7f9;
 
+    border: 1px solid #ddd;
 
+    border-radius: 8px;
 
+    position: absolute;
 
+    top: 14px;
 
+    right: 8px;
 
+}
 
+#header .container .btn {
 
+    width: 100px;
 
+    height: 38px;
 
+    text-align: center;
 
+    line-height: 38px;
 
+    color: #fff;
 
+    background: #1ebcf0;
 
+    float: right;
 
+    border-radius: 3px;
 
+    font-size: 16px;
 
+    margin-right: 12px;
 
+    margin-top: 4px;
 
+    border: 1px solid #1ebcf0;
 
+}
 
+#header .container .btn:hover {
 
+    background: #31CCFF;
 
+}
 
+#main .banner {
 
+    width: 1920px;
 
+    height: 482px;
 
+    margin: 0 auto;
 
+    position: relative;
 
+}
 
+#main .banner .search {
 
+    width: 692px;
 
+    height: 59px;
 
+    background: rgba(0, 0, 0, .15);
 
+    border-radius: 4px;
 
+    padding-top: 4.5px;
 
+    position: absolute;
 
+    top: 214px;
 
+    left: 616px;
 
+}
 
+#main .banner .search input {
 
+    width: 588px;
 
+    height: 50px;
 
+    float: left;
 
+    margin-left: 3px;
 
+    outline: none;
 
+    border-radius: 4px;
 
+    border:1px solid #ccc;
 
+    position: relative;
 
+    background: rgba(255, 255, 255, .88);;
 
+}
 
+#main .banner  .word {
 
+    color: #999;
 
+    font-size: 14px;
 
+    position: absolute;
 
+    top: 234px;
 
+    left: 650px;
 
+    z-index: 9;
 
+}
 
+#main .banner .search img {
 
+    width: 97px;
 
+    height: 50px;
 
+    float: left;
 
+}
 
+#main .list {
 
+    width: 1260px;
 
+    height: 388px;
 
+    margin: 60px auto 100px;
 
+}
 
+#main .list .listItem {
 
+    width: 290px;
 
+    height: 288px;
 
+    float: left;
 
+    margin-left: 33px;
 
+    margin-top: 50px;
 
+}
 
+#main .list .listItem:first-child {
 
+    margin-left: 0;
 
+}
 
+#main .list .listItem .pictures {
 
+    width: 290px;
 
+    height: 200px;
 
+    position: relative;
 
+}
 
+#main .list .listItem img {
 
+    width: 100%;
 
+    height: 200px;
 
+}
 
+#main .list .listItem .btn {
 
+    margin-top: 45px;
 
+}
 
+
 
+#main .list .listItem span:nth-child(2) {
 
+    margin-left: 40px;
 
+}
 
+#main .list .listItem span {
 
+    width: 122px;
 
+    height: 36px;
 
+    font-size: 14px;
 
+    color: #666;
 
+    display: inline-block;
 
+    text-align: center;
 
+    line-height: 36px;
 
+    border:1px solid #dfdfdf;
 
+}
 
+
 
+#main .list .listItem span:hover {
 
+    color: #31CCFF;
 
+}
 
+
 
+#main .list .listItem .pertty {
 
+    width: 290px;
 
+    height: 50px;
 
+    color: #fff;
 
+    font-size: 16px;
 
+    text-align: center;
 
+    line-height: 50px;
 
+    background: rgba(0, 0, 0, .5);
 
+    position: absolute;
 
+    top: 150px;
 
+    left: 0;
 
+    display: none;
 
+}
 
+#main .list .listItem .pictures:hover .pertty{
 
+    display: block;
 
+}

+ 84 - 0
html+css/day5/demo/index.html
Целия файл 

@@ -0,0 +1,84 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+    <link rel="stylesheet" type="" href="./index.css">
 
+</head>
 
+<body>
 
+    <div id="box">
 
+        <div id="header">
 
+            <div class="container">
 
+                <div class="logo"></div>
 
+                <div class="nav">
 
+                    <ul>
 
+                        <li title="首页"><a href="">首页</a></li>
 
+                        <li><a href="">设计</a></li>
 
+                        <li><a href="">摄影</a></li>
 
+                        <li><a href="">多媒体</a></li>
 
+                        <li><a href="">AI生画</a></li>
 
+                    </ul>
 
+                    <div class="tips">Beta</div>
 
+                </div>
 
+                <div class="btn">登录/注册</div>
 
+            </div>
 
+        </div>
 
+        <div id="main">
 
+            <div class="banner">
 
+                <img src="./images/bannerjpg.jpg" alt="">
 
+                <div class="search">
 
+                    <input type="text">
 
+                    <img src="./images/newIndex-searchBtn.png" alt="">
 
+                </div>
 
+                <div class="word">
 
+                    请输入<b>标题</b>、<b>编号</b>、<b>作品关键字</b>搜索
 
+                </div>
 
+            </div>
 
+            <div class="list">
 
+                <div class="listItem">
 
+                    <div class="pictures">
 
+                        <img src="./images/1.jpg" alt=""></img>
 
+                        <div class="pertty">蛇年美陈</div>
 
+                    </div>
 
+                    <div class="btn">
 
+                        <span>台球</span>
 
+                        <span>企业文化墙</span>
 
+                    </div>
 
+                </div>
 
+                <div class="listItem">
 
+                    <div class="pictures">
 
+                        <img src="./images/1.jpg" alt=""></img>
 
+                        <div class="pertty">蛇年美陈</div>
 
+                    </div>
 
+                    <div class="btn">
 
+                        <span>台球</span>
 
+                        <span>企业文化墙</span>
 
+                    </div>
 
+                </div>
 
+                <div class="listItem">
 
+                    <div class="pictures">
 
+                        <img src="./images/1.jpg" alt=""></img>
 
+                        <div class="pertty">蛇年美陈</div>
 
+                    </div>
 
+                    <div class="btn">
 
+                        <span>台球</span>
 
+                        <span>企业文化墙</span>
 
+                    </div>
 
+                </div>
 
+                <div class="listItem">
 
+                    <div class="pictures">
 
+                        <img src="./images/1.jpg" alt=""></img>
 
+                        <div class="pertty">蛇年美陈</div>
 
+                    </div>
 
+                    <div class="btn">
 
+                        <span>台球</span>
 
+                        <span>企业文化墙</span>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="footer"></div>
 
+    </div>
 
+</body>
 
+</html>

+ 0 - 0
day5/定位.html → html+css/day5/定位.html
Целия файл


+ 230 - 0
html+css/包图网/demo.css
Целия файл 

@@ -0,0 +1,230 @@
 
+* {
 
+  margin: 0;
 
+  padding: 0;
 
+  list-style: none;
 
+  text-decoration: none;
 
+  box-sizing: border-box;
 
+}
 
+#header {
 
+  width: 100%;
 
+  height: 35px;
 
+  background: #EEEEEE;
 
+}
 
+#header .con {
 
+  width: 1087px;
 
+  height: 100%;
 
+  margin: 0 auto;
 
+}
 
+#header .con .part1 {
 
+  width: 150px;
 
+  height: 100%;
 
+  float: left;
 
+  font-family: Helvetica;
 
+  font-size: 12px;
 
+  color: #888888;
 
+  font-weight: 400;
 
+  line-height: 35px;
 
+}
 
+
 
+#header .con .part2 {
 
+    float: left;
 
+    width: 65px;
 
+    font-size: 12px;
 
+    height: 100%;
 
+    line-height: 35px;
 
+    margin-left: 25px;
 
+}
 
+#header .con .part2 ul li {
 
+    float: left;
 
+    color: #888888;
 
+}
 
+#header .con .part2 ul li:nth-child(2) {
 
+    width: 1px;
 
+    height: 10px;
 
+    background: #888888;
 
+    margin-top: 13px;
 
+    margin-left: 4px;
 
+}
 
+#header .con .part2 ul li:last-child {
 
+    color: #6F26BD;
 
+    margin-left: 4px;
 
+}
 
+#header .con .part3 {
 
+    width: 269px;
 
+    height: 35px;
 
+    line-height: 35px;
 
+    float: right;
 
+    margin-right: 60px;
 
+}
 
+
 
+#header .con .part3 ul li {
 
+    float: left;
 
+    font-size: 12px;
 
+    color: #888;
 
+}
 
+#header .con .part3 ul li:nth-child(3) {
 
+    color: #6F26BD;
 
+    /* margin-left: 4px; */
 
+}
 
+#header .con .part3 ul li:nth-child(even) {
 
+    width: 1px;
 
+    height: 10px;
 
+    background: #888;
 
+    margin-top: 13px;
 
+    /* margin-left: 3px; */
 
+}
 
+#header .con .part3 ul li{
 
+    margin-left: 6px;
 
+}
 
+#header .con .part3 ul li:first-child {
 
+    margin-left: 0;
 
+}
 
+#main .search {
 
+    width: 1089px;
 
+    height: 76px;
 
+    margin: 0 auto;
 
+    margin-top: 44px;
 
+    position: relative;
 
+}
 
+#main .search .logo {
 
+    width: 176px;
 
+    height: 49px;
 
+    float: left;
 
+    background: url("./images/LOGO.png");
 
+}
 
+#main .search .inp {
 
+    width: 540px;
 
+    height: 44px;
 
+    float: left;
 
+    margin-left: 123px;
 
+    border: 2px solid #6F26BD;
 
+}
 
+/* 474 62 */
 
+#main .search .inp input {
 
+    width: 474px;
 
+    height: 100%;
 
+    float: left;
 
+    color: #888;
 
+    font-size: 14px;
 
+    padding: 18px;
 
+}
 
+
 
+#main .search .inp .btn {
 
+    width: 62px;
 
+    height: 100%;
 
+    float: left;
 
+    color: #fff;
 
+    font-size: 16px;
 
+    text-align: center;
 
+    line-height: 44px;
 
+    background: #6F26BD;
 
+}
 
+#main  .tip {
 
+    width: 540px;
 
+    height: 17px;
 
+    font-size: 12px;
 
+    position: absolute;
 
+    top: 57px;
 
+    left: 300px;
 
+}
 
+#main  .tip ul li {
 
+    float: left;
 
+    color: #999999;
 
+    margin-left: 25px;
 
+}
 
+
 
+#main  .tip ul li:first-child {
 
+    margin-left: 0;
 
+}
 
+#main .shop {
 
+    width: 90px;
 
+    height: 21px;
 
+    float: left;
 
+    margin-top: 15px;
 
+    margin-left: 52px;
 
+}
 
+#main .shop img {
 
+    width: 23px;
 
+    height: 21px;
 
+    float: left;
 
+}
 
+#main .shop .word {
 
+    float: left;
 
+    font-size: 12px;
 
+    color: #959595;
 
+    margin-top: 7px;
 
+    margin-left: 6px;
 
+}
 
+#main .allList {
 
+    width: 1089px;
 
+    height: 50px;
 
+    position: relative;
 
+    margin: 36.2px auto 0;
 
+}
 
+#main .allList ul li {
 
+    float: left;
 
+    font-size: 14px;
 
+    padding: 15px 40px;
 
+
 
+}
 
+#main .allList ul li:first-child {
 
+    padding: 0;
 
+    width: 260px;
 
+    height: 50px;
 
+    text-align: center;
 
+    line-height: 50px;
 
+}
 
+#main .allList ul li:hover {
 
+    background: #6F26BD;
 
+    color: #fff;
 
+}
 
+#main .allList ul li:first-child {
 
+    background: #6F26BD;
 
+    color: #fff;
 
+}
 
+#main .allList .news {
 
+    position: absolute;
 
+    top: -4px;
 
+    left: 420px;
 
+}
 
+#main .allList .hot {
 
+    position: absolute;
 
+    top: -4px;
 
+    left: 724px;
 
+}
 
+#main .banner {
 
+    width: 100%;
 
+    height: 576px;
 
+    background: #f00;
 
+    background: url("./images/banner.png") no-repeat center;
 
+}
 
+
 
+#main .banner .con {
 
+    width: 1089px;
 
+    height: 100%;
 
+    margin: 0 auto;
 
+    position: relative;
 
+    /* background: #ff0; */
 
+}
 
+/* #main .banner img {
 
+    display: block;
 
+    width: 1920px;
 
+    height: 576px;
 
+    margin: 0 auto;
 
+} */
 
+
 
+#main .banner .dialog {
 
+    width: 260px;
 
+    height: 546px;
 
+    opacity: 0.4;
 
+    position: absolute;
 
+    top: 0px;
 
+    left: 0;
 
+    background: #000000;
 
+}
 
+ 
+    /* position: absolute;
 
+    top: 50%;
 
+    left: 50%;
 
+    margin-left: -960px;
 
+    margin-top: -288px; */

+ 79 - 0
html+css/包图网/demo.html
Целия файл 

@@ -0,0 +1,79 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+    <link rel="stylesheet" href="./demo.css">
 
+</head>
 
+<body>
 
+    <div id="box">
 
+        <div id="header">
 
+            <div class="con">
 
+                <div class="part1">您好，欢迎进入包图购物网</div>
 
+                <div class="part2">
 
+                    <ul>
 
+                        <li>登录</li>
 
+                        <li></li>
 
+                        <li>注册</li>
 
+                    </ul>
 
+                </div>
 
+                <div class="part3">
 
+                    <ul>
 
+                        <li>设为首页 ☆</li>
 
+                        <li></li>
 
+                        <li>加入收藏</li>
 
+                        <li></li>
 
+                        <li>客户服务</li>
 
+                        <li></li>
 
+                        <li>关注官方微博</li>
 
+                    </ul>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="main">
 
+            <div class="search">
 
+                <div class="logo">
 
+                </div>
 
+                <div class="inp">
 
+                    <input type="text" placeholder="618活动">
 
+                    <div class="btn">搜索</div>
 
+                </div>
 
+                <div class="tip">
 
+                    <ul>
 
+                        <li>时尚女鞋</li>
 
+                        <li>简易家具</li>
 
+                        <li>仙女公主裙</li>
 
+                        <li>BF风裤子</li>
 
+                    </ul>
 
+                </div>
 
+                <div class="shop">
 
+                    <img src="./images/shop.png" alt="">
 
+                    <div class="word">购物车物品</div>
 
+                </div>
 
+            </div>
 
+            <div class="allList">
 
+                <ul>
 
+                    <li>全部商品分类</li>
 
+                    <li>商城首页</li>
 
+                    <li>所有商品</li>
 
+                    <li>团购专区</li>
 
+                    <li>秒杀专区</li>
 
+                    <li>实体店</li>
 
+                    <li>客户实拍</li>
 
+                </ul>
 
+                <img src="./images/new.png" alt="" class="news">
 
+                <img src="./images/hot.png" alt="" class="hot">
 
+            </div>
 
+            <div class="banner">
 
+                <div class="con">
 
+                    
+                <!-- <img src="./images/banner.png" alt=""> -->
 
+                <div class="dialog"></div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="footer"></div>
 
+    </div>
 
+</body>
 
+</html>

BIN
html+css/包图网/images/LOGO.png
Целия файл


BIN
html+css/包图网/images/banner.png
Целия файл


BIN
html+css/包图网/images/hot.png
Целия файл


BIN
html+css/包图网/images/new.png
Целия файл


BIN
html+css/包图网/images/shop.png
Целия файл


+ 2 - 0
js/js基础/1.js
Целия файл 

@@ -0,0 +1,2 @@
 
+document.write("hello");
 
+// 向页面写入内容   document.writ("xxx")

+ 23 - 0
js/js基础/1.js的引入.html
Целия файл 

@@ -0,0 +1,23 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+    <!-- <script defer>
 
+        defer 延迟加载
 
+        // script 标签中写js代码
 
+        alert("你好")
 
+    </script> -->
 
+</head>
 
+<body>
 
+    <div>
 
+        <h1>这是第一个js</h1>
 
+    </div>
 
+    <!-- <script>
 
+        // script 标签中写js代码
 
+        alert("你好")
 
+    </script> -->
 
+    <script src="./1.js"></script>
 
+</body>
 
+</html>

+ 2 - 0
js/js基础/2.js
Целия файл 

@@ -0,0 +1,2 @@
 
+console.log("哈哈哈哈")
 
+// 在当前页面终端 node 名字.js启动

+ 38 - 0
js/js基础/2.变量.html
Целия файл 

@@ -0,0 +1,38 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        // 单行注释 ctrl+/
 
+        /**
 
+         * 多行注释
 
+         * 
+         * 变量的命名规则
 
+         * 1.变量可以已英文、数字、下划线_、美元符号$命名
 
+         * 2.变量可以已英文、数字、下划线开头
 
+         * 3.变量严格区分大小写
 
+         * 4.变量不能使用关键字、保留字
 
+         * 
+        */
 
+        // 字面量 1 2 3 4 5 true false 
+        // 变量
 
+        console.log(a,'aaa');//undefined 存在但没有值 未被定义的
 
+        // var a;
 
+        var a = 10;
 
+        var a = 20;
 
+        var y;
 
+        var Y;
 
+        // var class;
 
+        // var 声明变量 变量提升
 
+        // 允许变量重复声明
 
+        // 打印
 
+        // a = 10;
 
+        // = 赋值
 
+        console.log(a);
 
+    </script>
 
+</body>
 
+</html>