演示部分

期末作業——純前端的網站頁面

原始碼部分

主html

說實話沒什麼技術，就不展示了

css

部分展示

/*引入字型*/
@font-face {
  font-family: "Pacifico";
  src: url('../font/PACIFICO.ttf');
}
@font-face {
  font-family: "Quicksand";
  src: url('../font/Quicksand-Bold.ttf');
}
@font-face {
  font-family: "Quicksand_light"
 
;
  src: url('../font/Quicksand-Light.ttf');
}
/*引入字型小圖示*/
@font-face {
  font-family: 'iconfont';
  src: url('../font/icons/iconfont.eot');
  src: url('../font/icons/iconfont.eot?#iefix') format('embedded-opentype'), url('../font/icons/iconfont.woff2') format('woff2'), url('../font/icons/iconfont.woff') format('woff'
 
), url('../font/icons/iconfont.ttf') format('truetype'), url('../font/icons/iconfont.svg#iconfont') format('svg');
}
div#bg {
  position: fixed;
  z-index: -1;
  width: 100%;
  height: 100%;
}
div#bg div.bg1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 758px;
  height: 519px;
  background: url("../img/bgimg/bg-left.png"
 
) no-repeat;
}
div#bg div.bg2 {
  position: absolute;
  top: 0;
  right: -200px;
  width: 633px;
  height: 536px;
  background: url("../img/bgimg/bg-right.png") no-repeat top right;
}
@media screen and (max-width: 980px) {
  div#bg div.bg1,
  div#bg div.bg2 {
    background: #F3F3F3;
  }
}
div#header {
  width: 100%;
  max-width: 1240px;
  height: 90px;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 980px) {
  div#header {
    background-color: white;
  }
}
div#header .logo {
  width: 165px;
  height: 32px;
  position: absolute;
  top: 29px;
  left: 35%;
  transform: translateX(-50%);
}
@media screen and (max-width: 980px) {
  div#header .logo {
    left: 130px;
  }
}
div#header .logo img {
  display: block;
  float: left;
  height: 32px;
  width: 32px;
}
div#header .logo span {
  float: left;
  font-family: "Pacifico";
  font-size: 26px;
  line-height: 32px;
  letter-spacing: 3px;
  font-weight: 700;
}
div#header .btn {
  width: 50px;
  height: 50px;
  float: right;
  margin: 20px 80px 0 0;
  border-radius: 50%;
  box-shadow: -1px 1px 5px #999;
  font-size: 26px;
  text-align: center;
  line-height: 50px;
  background-color: white;
  cursor: pointer;
  transition: box-shadow 0.3s;
  font-family: "iconfont" !important;
}

點選直接資料領取

傳送 0013
如果你在學習python或者Java哪怕是C遇到問題都可以來給我留言，因為在學習初期新手總會走很多彎路，這個時候如果沒有有個人來幫一把的話很容易就放棄了。身邊很多這樣的例子許多人學著學著就轉了專業換了方向，不僅是自身問題還是沒有正確的學習。所以作為一個過來人我希望有問題給我留言，說不上是幫助就是順手敲幾行字的事情。

這裡有python，Java學習資料還有有有趣好玩的程式設計專案，更有難尋的各種資源。反正看看也不虧。