计算机毕业设计-仿QQ音乐--HTML+CSS

时间:2025-03-30 08:58:32
  • * {
  • margin: 0;
  • padding: 0;
  • }
  • header {
  • width: 1200px;
  • height: 142px;
  • margin: 0 auto;
  • }
  • .first .logo {
  • float: left;
  • }
  • .first .logo a img {
  • display: block;
  • width: 170px;
  • height: 46px;
  • padding-top: 22px;
  • }
  • .first .navtop {
  • float: left;
  • overflow: hidden;
  • }
  • .first .navtop ul {
  • list-style: none;
  • margin-left: 30px;
  • height: 90px;
  • }
  • .first .navtop ul li .current:hover {
  • color: white;
  • }
  • .first .search {
  • float: left;
  • overflow: hidden;
  • margin: 26px 0 0 10px;
  • border: 1px solid #f2f2f2;
  • border-radius: 5px;
  • position: relative;
  • }
  • .songSheet_pics ul li:hover .cover_icon_play {
  • opacity: 0.9;
  • transform: scale(1) translateZ(0);
  • transition-property: opacity, transform;
  • transition-duration: 0.5s;
  • cursor: pointer;
  • }
  • .songSheet_pics ul li:hover .cover_icon_play,
  • .cover_icon_play {
  • background-image: url(../pics/);
  • background-repeat: no-repeat;
  • }
  • .
  • }
  • .content .songSheet .carrousel a {
  • display: block;
  • width: 20px;
  • height: 38px;
  • position: absolute;
  • top: 250px;
  • background-image: url(./img/);
  • background-repeat: no-repeat;
  • }
  • .content .songSheet .carrousel .leftBtn {
  • left: -80px;
  • background-position: -20px -120px;
  • }
  • .content .songSheet .carrousel .rightBtn {
  • right: -80px;
  • background-position: 0 -120px;
  • }
  • .content .songSheet .area ul {
  • text-align: center;
  • width: 390px;
  • margin-top: 30px;
  • }
  • .content .songSheet .playall {
  • position: absolute;
  • left: 0;
  • top: initial;
  • border: 1px solid #c9c9c9;
  • color: #000;
  • margin-left: 10%;
  • margin-top: 20px;
  • border-radius: 2px;
  • font-size: 14px;
  • margi
  • }
  • .content .songSheet .newsongs ul li span {
  • display: block;
  • position: absolute;
  • right: 35px;
  • top: 45px;
  • color: #999;
  • font-family: "poppin";
  • }
  • footer .shang {
  • text-align: center;
  • margin: 0 auto;
  • width: 100%;
  • height: 250px;
  • }
  • footer .shang .right,
  • .center,
  • .left {
  • float: left;
  • margin-left: 290px;
  • }
  • footer .shang .right ul li {
  • footer .shang .center ul li a {
  • text-decoration: none;
  • color: #999;
  • }
  • footer .shang .center ul li a :hover {
  • color: #31c27c;
  • }
  • footer .shang .left ul li {
  • list-style: none;
  • margin: 5px 0;
  • }
  • footer .shang .left ul li a {
  • text-decoration: none;