关于仿写00片刻企业站
生活随笔
收集整理的這篇文章主要介紹了
关于仿写00片刻企业站
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
關于仿寫00片刻企業站
單頁index
代碼段如下
<!DOCTYPE html> <html lang="en"><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>片刻</title><style>* {margin: 0;padding: 0;text-decoration: none;list-style: none;}h1 {display: none;}/* nav 導航欄 */.nav {/* 以100%的寬度顯示但是需要一個最小寬度 */min-width: 1354px;height: 90px;/* background-color: pink; *//* min-width: 800px;如果瀏覽器的寬度大于800,那么nav的寬度就是瀏覽器的寬度如果瀏覽器的寬度小于800,那么nav的寬度就是800 */}.nav .wrap {width: 1354px;height: 90px;margin: 0 auto;}.nav .wrap .logo {float: left;height: 46px;margin-top: 22px;margin-left: 76px;margin-right: 88px;}.nav .wrap a {float: left;width: 74px;color: #000;line-height: 87px;height: 87px;border-bottom: 3px solid #fff;text-align: center;}.nav .wrap .now {background-color: #fafafa;border-color: #000;}.nav .wrap .login {float: right;width: 118px;height: 44px;line-height: 44px;border: 1px solid #60b469;margin-top: 22px;margin-right: 78px;color: #60b469;border-radius: 23px;font-style: 14px;}/* main 主體 */.main {background-color: #f9f9f9;min-width: 1354px;}.main .wrap {width: 900px;margin: 0 auto;overflow: hidden;}.main .wrap .tus {height: 450px;margin-top: 30px;}.main .wrap .tus img {width: 50%;float: left;height: 100%;}.main .wrap .tus div {width: 50%;height: 100%;float: left;}.main .wrap .tus div img {width: 50%;height: 50%;float: left;}/* 標題 */.main .wrap .title {height: 18px;margin: 74px 0 40px;}.main .wrap .title span {height: 18px;line-height: 18px;font-size: 16px;float: left;}.main .wrap .title .cube {height: 18px;width: 18px;margin-right: 14px;background-color: #000;}.main .wrap .read li {height: 193px;width: 898px;/* background-color: pink; */border: 1px solid #e8e8e8;}.main .wrap .read li div {width: 628px;height: 193px;float: left;/* background-color: yellow; */}.main .wrap .read li div p {margin: 0 54px 0 20px;color: #989898;}.main .wrap .read li div .title {font-size: 24px;height: 32px;line-height: 32px;margin-top: 12px;}.main .wrap .read li div .author {height: 24px;font-size: 16px;line-height: 24px;}.main .wrap .read li div .line {width: 30px;height: 1px;background-color: #989898;margin: 12px 0 16px 20px;float: none;}.main .wrap .read li div .words {font-size: 12px;height: 32px;line-height: 16px;}.main .wrap .read li div .words span {color: #60b469;}.main .wrap .read li div .words img {width: 12px;height: 12px;margin-top: 4px;}.main .wrap .read li img {width: 270px;height: 100%;float: right;}/* data 兩塊用到改造成公共樣式 *//* ----------start-------------- */.main .wrap .read li div .data {height: 16px;margin-top: 26px;}.main .wrap .raed li div .data span {height: 16px;line-height: 16px;font-size: 12px;float: left;color: #989898;}.main .wrap .read li div .data .sl {margin: 0 10px;}/* -----------end------------ *//* ting */.main .wrap .ting {height: 390px;/* background-color: pink; */}.main .wrap .ting li {float: left;height: 388px;width: 276px;border-radius: 10px;overflow: hidden;border: 1px solid #e8e8e8;background-color: #fff;color: #989898;}.main .wrap .ting li img {height: 276px;width: 278px;display: block;}.main .wrap .ting li p {margin-left: 10px;margin-right: 10px;}.main .wrap .ting li .name {font-size: 24px;height: 28px;line-height: 28px;margin-top: 20px;overflow: hidden;}.main .wrap .ting li .zhubo {font-size: 12px;height: 20px;line-height: 20px;margin-top: 5px;}.main .wrap .ting li div .data {height: 16px;margin-top: 16px;}.main .wrap .ting li div .data span {height: 16px;line-height: 16px;font-size: 12px;float: left;color: #989898;}.main .wrap .ting li div .data .sl {margin: 0 10px;}.main .wrap .pk li {height: 234px;width: 218px;margin-top: 40px;margin-left: 5px;float: left;border: 1px solid #e8e8e8;}.main .wrap .pk li .left {height: 234px;width: 100px;float: left;}.main .wrap .pk li .left .logo {height: 80px;width: 80px;margin-top: 50px;margin-left: 20px;border-radius: 50%;}.main .wrap .pk li .left .type {width: 56px;height: 20px;margin-top: 10px;margin-left: 30px;border-radius: 10px;}.main .wrap .pk li .right {width: 98px;margin-left: 20px;height: 234px;float: left;}.main .wrap .pk li .right .title {margin-top: 72px;height: 18px;font-size: 18px;line-height: 18px;}.main .wrap .pk li .right .author {height: 14px;margin-top: 10px;line-height: 14px;font-size: 14px;color: #989898;}.main .wrap .pk li .right .line {height: 3px;width: 16px;margin-top: 28px;background-color: #989898;}.main .wrap a img {height: 56px;width: 194px;border-radius: 24px;margin: 100px 353px;}.bottom {min-width: 1354px;height: 124px;}.bottom .wrap {width: 1354px;height: 124px;margin: 0 auto;overflow: hidden;background-color: #252525;}.bottom .wrap .logo {height: 50px;margin-left: 126px;margin-top: 37px;float: left;}.bottom .wrap .center {height: 50px;margin-left: 20px;margin-top: 37px;float: left;}.bottom .wrap .center a {height: 25px;font-size: 14px;line-height: 25px;margin-left: 16px;float: left;color: #989898;}.bottom .wrap .center div a {color: #434343;font-size: 14px;margin-left: 0;}.bottom .wrap .right {height: 40px;margin-top: 36px;margin-right: 30px;float: right;}</style> </head><body><h1>片刻</h1><div class="nav"><div class="wrap"><img class="logo" src="./img/head-logo.png" alt=""><a class="now" href="###">首頁</a><a href="###">閱讀</a><a href="###">電臺</a><a href="###">碎片</a><a href="###">客戶端</a><a class="login" href="###">登錄/注冊</a></div></div><div class="main"><div class="wrap"><div class="tus"><img src="./img/banner.jpg" alt=""><div><img src="./img/banner1.jpg" alt=""><img src="./img/banner2.jpg" alt=""><img src="./img/banner3.jpg" alt=""><img src="./img/banner4.jpg" alt=""></div></div><p class="title"><span class="cube"></span><span>閱讀 | Head</span></p><ul class="read"><li><div><p class="title">年華</p><p class="author">By / 盜夢的益安</p><div class="line"></div><p class="words">1.在結婚一次,當下的安穩,只拍一組白紗做紀念,懷孕已三月,也不見胖,漲點年紀事韻味,挽著G先生得手,不輸那些年輕那女,到這個年紀再婚,條件不用列舉,彼此心里都有<span>VIEW ALL</span><img src="./img/viewall.png" alt=""></p><p class="data"><span>5.3k次閱讀</span><span class="sl">|</span><span>評論52</span><span class="sl">|</span><span>喜歡118</span></p></div><img src="./img/list1.png" alt=""></li><li style="margin: 10px 0;"><div><p class="title">偷心</p><p class="author">By / 子夜星星</p><div class="line"></div><p class="words">-001-她說我要去投一個東西,你幫我好不好,她說這句話的時候,沒有一點求我辦事的語氣-001-她說我要去投一個東西,你幫我好不好,她說這句話的時候,沒有一點求我辦事的語氣-001-她說我要去投一個東西,你幫我好不好,她說這句話的時候,沒有一點求我辦事的語氣<span>VIEW ALL</span><img src="./img/viewall.png" alt=""></p><p class="data"><span>3.9k次閱讀</span><span class="sl">|</span><span>評論25</span><span class="sl">|</span><span>喜歡124</span></p></div><img src="./img/list2.png" alt=""></li><li><div><p class="title">友人集|與風眠,與你告別和重逢</p><p class="author">By / 方小魚Finnny</p><div class="line"></div><p class="words">離別也是一種重逢,在電話里對我講離別也是一種重逢,在電話里對我講離別也是一種重逢,在電話里對我講離別也是一種重逢,在電話里對我講離別也是一種重逢,在電話里對我講離別也是一種重逢,在電話里對我講離別也是一種重逢,在電話里對我講<span>VIEW ALL</span><img src="./img/viewall.png" alt=""></p><p class="data"><span>5.3k次閱讀</span><span class="sl">|</span><span>評論7</span><span class="sl">|</span><span>喜歡35</span></p></div><img src="./img/list3.png" alt=""></li></ul><p class="title"><span class="cube"></span><span>TING</span></p><ul class="ting"><li><img src="./img/5.jpg" alt=""><p class="name">“我從來不想獨身”</p><p class="zhubo">主播/樹茵</p><p class="data"><span>5.3k次播放</span><span class="sl">|</span><span>評論52</span><span class="sl">|</span><span>喜歡118</span></p></li><li style="margin: 0 33px;"><img src="./img/8.jpg" alt=""><p class="name">那份笨拙的愛,是心</p><p class="zhubo">主播/你好難忘</p><p class="data"><span>10.2k次播放</span><span class="sl">|</span><span>評論33</span><span class="sl">|</span><span>喜歡316</span></p></li><li><img src="./img/2.jpg" alt=""><p class="name">翻唱|無問東西</p><p class="zhubo">主播/woo控</p><p class="data"><span>11.1k次閱讀</span><span class="sl">|</span><span>評論42</span><span class="sl">|</span><span>喜歡348</span></p></li></ul><p class="title"><span class="cube"></span><span>人氣片刻 | Hot Pianker</span></p><ul class="pk"><li style="margin-left: 0;"><div class="left"><img class="logo" src="./img/1-2.jpg" alt=""><img class="type" src="./img/user_musician.png" alt=""></div><div class="right"><p class="title">雙笙子</p><div class="line"></div><p class="author">古風歌手雙笙</p></div></li><li><div class="left"><img class="logo" src="./img/7.jpg" alt=""><img class="type" src="./img/user_musician.png" alt=""></div><div class="right"><p class="title">Miss組合</p><div class="line"></div><p class="author">28屆金曲獎</p></div></li><li><div class="left"><img class="logo" src="./img/3.jpg" alt=""><img class="type" src="./img/user_musician.png" alt=""></div><div class="right"><p class="title">Muma木馬</p><div class="line"></div><p class="author">搖滾音樂人 木馬</p></div></li><li><div class="left"><img class="logo" src="./img/1.jpg" alt=""><img class="type" src="./img/user_author.png" alt=""></div><div class="right"><p class="title">片刻小主</p><div class="line"></div><p class="author">片刻官方貓</p></div></li></ul><a href="###"><img src="./hover/botton.png" alt=""></a></div></div><div class="bottom"><div class="wrap"><img class="logo" src="./img/foot-logo.png" alt=""><div class="center"><a href="###" style="margin-left: 0;">關于我們</a><a href="###">友情鏈接</a><a href="###">片刻幫助</a><a href="###">意見反饋</a><a href="###">成長記憶</a><div><a href="###">All rights resserved © 2016 pianke.me /黔ICP備17008875號-1</a></div></div><img src="./img/footer-logo2.png" alt="" class="right" style="margin-right: 180px;"><img src="./img/1.png" alt="" class="right" style="margin-right: 44px;"><img src="./img/footer-logo3.png" alt="" class="right"><img src="./img/footer-logo.png" alt="" class="right"></div></div> </body></html>單頁read
代碼段如下
<!DOCTYPE html> <html lang="en"><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>read</title><style>* {margin: 0;padding: 0;text-decoration: none;list-style: none;}h1 {display: none;}/* nav 導航欄 */.nav {/* 以100%的寬度顯示但是需要一個最小寬度 */min-width: 1354px;height: 90px;/* background-color: pink; *//* min-width: 800px;如果瀏覽器的寬度大于800,那么nav的寬度就是瀏覽器的寬度如果瀏覽器的寬度小于800,那么nav的寬度就是800 */}.nav .wrap {width: 1354px;height: 90px;margin: 0 auto;}.nav .wrap .logo {float: left;height: 46px;margin-top: 22px;margin-left: 76px;margin-right: 88px;}.nav .wrap a {float: left;width: 74px;color: #000;line-height: 87px;height: 87px;border-bottom: 3px solid #fff;text-align: center;}.nav .wrap .now {background-color: #fafafa;border-color: #000;}.nav .wrap .right img {height: 46px;width: 46px;margin-top: 24px;border: 50%;margin-right: 30px;float: right;}.nav .wrap .right {float: right;}.nav .wrap .login {float: right;width: 118px;height: 44px;line-height: 44px;border: 1px solid #60b469;margin-top: 22px;margin-right: 78px;color: #60b469;border-radius: 23px;font-style: 14px;}/* main 主體 */.main {background-color: #f9f9f9;min-width: 1354px;}.main .wrap {width: 900px;margin: 0 auto;overflow: hidden;}.main .wrap .tu {height: 500px;margin-top: 30px;border-radius: 24px;background-image: url(./img/banner1-6.JPG);background-size: 100% 100%;}.main .wrap .title {height: 18px;margin: 74px 0 40px;}.main .wrap .title span {height: 18px;line-height: 18px;font-size: 16px;float: left;}.main .wrap .title .cube {height: 18px;width: 18px;margin-right: 14px;background-color: #000;}.main .wrap .class {overflow: hidden;}.main .wrap .class .tu {height: 90px;width: 178px;background-image: url(./img/one.jpg);float: left;text-align: center;background-size: 100% 100%;margin: 1px;}.main .wrap .class .tu p {height: 18px;line-height: 18px;font-size: 18px;margin-top: 32px;color: white;}.main .wrap .read li {height: 200px;width: 898px;background-color: white;border: 1px solid #989898;}.main .wrap .read li p {margin-left: 20px;color: #989898;}.main .wrap .read li .title {height: 24px;margin-top: 20px;font-size: 24px;line-height: 24px;margin-bottom: 20px;}.main .wrap .read li .author {height: 18px;line-height: 18px;font-size: 18px;}.main .wrap .read li .line {width: 30px;height: 1px;background-color: #989898;margin: 8px 0 8px 20px;float: none;}.main .wrap .read li .words {font-size: 14px;height: 60px;line-height: 20px;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;}.main .wrap .read li .words span {color: #60b469;}.main .wrap .read li .words img {width: 12px;height: 12px;margin-top: 4px;}.main .wrap .read li .data {height: 16px;font-size: 12px;margin-top: 10px;}.main .wrap .raed li .data span {height: 16px;line-height: 16px;font-size: 12px;float: left;color: #989898;}.main .wrap .read li .data .sl {margin: 0 10px;}.main .wrap img {height: 216px;width: 900px;margin-top: 66px;}.bottom {min-width: 1354px;height: 124px;margin-top: 66px;}.bottom .wrap {width: 1354px;height: 124px;margin: 0 auto;overflow: hidden;background-color: #252525;}.bottom .wrap .logo {height: 50px;margin-left: 126px;margin-top: 37px;float: left;}.bottom .wrap .center {height: 50px;margin-left: 20px;margin-top: 37px;float: left;}.bottom .wrap .center a {height: 25px;font-size: 14px;line-height: 25px;margin-left: 16px;float: left;color: #989898;}.bottom .wrap .center div a {color: #434343;font-size: 14px;margin-left: 0;}.bottom .wrap .right {height: 40px;margin-top: 36px;margin-right: 30px;float: right;}</style> </head><body><h1>片刻</h1><div class="nav"><div class="wrap"><img class="logo" src="./img/head-logo.png" alt=""><a href="###">首頁</a><a class="now" href="###">閱讀</a><a href="###">電臺</a><a href="###">碎片</a><a href="###">客戶端</a><a class="login" href="###">登錄/注冊</a><a href="###" class="right"><img src="./hover/anniu.png" alt=""></a></div></div><div class="main"><div class="wrap"><div class="tu"></div><p class="title"><span class="cube"></span><span>分類 | Classification</span></p><div class="class"><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div><div class="tu"><p>早安故事</p></div></div><p class="title"><span class="cube"></span><span>熱門文章 | Hot Article</span></p><ul class="read"><li><p class="title">新的一年,你不解決這五件事,就不要奮斗了</p><p class="author">By / 陳陌予</p><div class="line"></div><p class="words">1.在結婚一次,當下的安穩,只拍一組白紗做1.在結婚一次,當下的安穩,只拍一組白紗做紀念,懷孕已三月,也不見胖,漲點年紀事韻味,挽著G先生得手,不輸那些年輕那女,到這個年紀再婚,條件不用列舉,彼此心里都有1.在結婚一次,當下的安穩,只拍一組白紗做紀念,懷孕已三月,也不見胖,漲點年紀事韻味,挽著G先生得手,不輸那些年輕那女,<span>VIEW ALL</span><img src="./img/viewall.png" alt=""></p><p class="data"><span>5.3k次閱讀</span><span class="sl">|</span><span>評論52</span><span class="sl">|</span><span>喜歡118</span></p></li><li style="margin: 10px 0;"><p class="title">新的一年,你不解決這五件事,就不要奮斗了</p><p class="author">By / 陳陌予</p><div class="line"></div><p class="words">1.在結婚一次,當下的安穩,只拍一組白紗做1.在結婚一次,當下的安穩,只拍一組白紗做紀念,懷孕已三月,也不見胖,漲點年紀事韻味,挽著G先生得手,不輸那些年輕那女,到這個年紀再婚,條件不用列舉,彼此心里都有1.在結婚一次,當下的安穩,只拍一組白紗做紀念,懷孕已三月,也不見胖,漲點年紀事韻味,挽著G先生得手,不輸那些年輕那女,<span>VIEW ALL</span><img src="./img/viewall.png" alt=""></p><p class="data"><span>5.3k次閱讀</span><span class="sl">|</span><span>評論52</span><span class="sl">|</span><span>喜歡118</span></p></li><li><p class="title">新的一年,你不解決這五件事,就不要奮斗了</p><p class="author">By / 陳陌予</p><div class="line"></div><p class="words">1.在結婚一次,當下的安穩,只拍一組白紗做1.在結婚一次,當下的安穩,只拍一組白紗做紀念,懷孕已三月,也不見胖,漲點年紀事韻味,挽著G先生得手,不輸那些年輕那女,到這個年紀再婚,條件不用列舉,彼此心里都有1.在結婚一次,當下的安穩,只拍一組白紗做紀念,懷孕已三月,也不見胖,漲點年紀事韻味,挽著G先生得手,不輸那些年輕那女,<span>VIEW ALL</span><img src="./img/viewall.png" alt=""></p><p class="data"><span>5.3k次閱讀</span><span class="sl">|</span><span>評論52</span><span class="sl">|</span><span>喜歡118</span></p></li></ul><img src="./img/conf.jpg" alt=""><img src="./img/conf2.jpg" alt=""><img src="./img/conf3.jpg" alt=""></div></div><div class="bottom"><div class="wrap"><img class="logo" src="./img/foot-logo.png" alt=""><div class="center"><a href="###" style="margin-left: 0;">關于我們</a><a href="###">友情鏈接</a><a href="###">片刻幫助</a><a href="###">意見反饋</a><a href="###">成長記憶</a><div><a href="###">All rights resserved © 2016 pianke.me /黔ICP備17008875號-1</a></div></div><img src="./img/footer-logo2.png" alt="" class="right" style="margin-right: 180px;"><img src="./img/1.png" alt="" class="right" style="margin-right: 44px;"><img src="./img/footer-logo3.png" alt="" class="right"><img src="./img/footer-logo.png" alt="" class="right"></div></div> </body></html>單頁fm3
代碼段 如下
<!DOCTYPE html> <html lang="en"> <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>fm</title><style>* {margin: 0;padding: 0;}* {margin: 0;padding: 0;text-decoration: none;list-style: none;}h1 {display: none;}/* nav 導航欄 */.nav {/* 以100%的寬度顯示但是需要一個最小寬度 */min-width: 1354px;height: 90px;/* background-color: pink; *//* min-width: 800px;如果瀏覽器的寬度大于800,那么nav的寬度就是瀏覽器的寬度如果瀏覽器的寬度小于800,那么nav的寬度就是800 */}.nav .wrap {width: 1354px;height: 90px;margin: 0 auto;}.nav .wrap .logo {float: left;height: 46px;margin-top: 22px;margin-left: 76px;margin-right: 88px;}.nav .wrap a {float: left;width: 74px;color: #000;line-height: 87px;height: 87px;border-bottom: 3px solid #fff;text-align: center;}.nav .wrap .now {background-color: #fafafa;border-color: #000;}.nav .wrap .right img {height: 46px;width: 46px;margin-top: 24px;border: 50%;margin-right: 30px;float: right;}.nav .wrap .right {float: right;}.nav .wrap .login {float: right;width: 118px;height: 44px;line-height: 44px;border: 1px solid #60b469;margin-top: 22px;margin-right: 78px;color: #60b469;border-radius: 23px;font-style: 14px;}.main {background-color: #f9f9f9;min-width: 1354px;}.main .wrap {width: 1000px;margin: 0 auto;overflow: hidden;}.main .wrap .tu {height: 500px;width: 1000px;margin-top: 30px;border-radius: 24px;background-image: url(./img/banner-1.jpg);background-size: 100% 100%;}.main .wrap .bk {height: 156px;width: 1000px;margin-top: 100px;border-top: 1px dashed #000;border-bottom: 1px dashed #000;}.main .wrap .bk div {height: 56px;width: 144px;background-color: white;border: 1px solid #e8e8e8;margin-top: 49px;float: left;margin-left: 4px;}.main .wrap .bk div img {height: 28px;margin-left: 38px;margin-top: 14px;float: left;}.main .wrap .bk div p {height: 28px;font-size: 18px;margin-top: 14px;margin-left: 12px;float: left;}.main .wrap .title {height: 18px;margin: 74px 0 40px;}.main .wrap .title span {height: 18px;line-height: 18px;font-size: 16px;float: left;}.main .wrap .title .cube {height: 18px;width: 18px;margin-right: 14px;background-color: #000;}.main .wrap .ting {height: 422px;}.main .wrap .ting li {width: 308px;height: 422px;border-radius: 1px;border: 1px solid #a9a9a9;float: left;border-top-left-radius: 5px;border-top-right-radius: 5px;}.main .wrap .ting li img {height: 308px;width: 308px;}.main .wrap .ting li p {color: #a9a9a9;margin-left: 20px;}.main .wrap .ting li .name {margin-top: 26px;height: 22px;font-size: 22px;line-height: 22px;width: 220px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; }.main .wrap .ting li .zhubo {height: 14px;line-height: 14px;font-size: 12px;margin-top: 8px;}.main .wrap .ting li .data {font-size: 12px;height: 14px;margin-top: 10px;}.main .wrap .ting li .data span {height: 14px;line-height: 14px;font-size: 12px;float: left;color: #989898;}.main .wrap .ting li .data .sl {margin: 0 10px;}.main .wrap .hot {height: 448px;}.main .wrap .hot li {width: 300px;height: 448px;float: left;text-align: center;}.main .wrap .hot li .img1 {position: absolute;z-index: 1;}.main .wrap .hot li .img1 img {height: 300px;width: 300px;border-radius: 10px;}.main .wrap .hot li .img2 {position: absolute;z-index: 2;top: 40px;}.main .wrap .hot li .img2 img {border-radius: 10px;height: 270px;width: 270px;}.main .wrap .hot li .img3 {position: absolute;z-index: 3;}.mian .wrap .hot li .img3 img {border-radius: 10px;height: 240px;}</style> </head> <body><h1>片刻</h1><div class="nav"><div class="wrap"><img class="logo" src="./img/head-logo.png" alt=""><a href="###">首頁</a><a href="###">閱讀</a><a class="now" href="###">電臺</a><a href="###">碎片</a><a href="###">客戶端</a><a class="login" href="###">登錄/注冊</a><a href="###" class="right"><img src="./hover/anniu.png" alt=""></a></div></div><div class="main"><div class="wrap"><div class="tu"></div><div class="bk"><div style="margin-left: 52px;"><img src="./img/love.png" alt=""><p>愛情</p></div><div><img src="./img/rip.png" alt=""><p>旅行</p></div><div><img src="./img/story.png" alt=""><p>故事</p></div><div><img src="./img/music.png" alt=""><p>音樂</p></div><div><img src="./img/movie.png" alt=""><p>電影</p></div><div style="margin-right: 52px;"><img src="./img/poetry.png" alt=""><p>讀詩</p></div></div><p class="title"><span class="cube"></span><span>推薦TING | Recommendation TING</span></p><ul class="ting"><li><img src="./img/cell-1.jpg" alt=""><p class="name">中國最好的民謠樂隊國最好的民謠樂隊</p><p class="zhubo">主播/文森FM</p><p class="data"><span>4.5k次播放</span><span class="sl">|</span><span>評論:4</span><span class="sl">|</span><span>喜歡:47</span></p> </li><li style="margin: 0 35px;"><img src="./img/cell-2.jpg" alt=""><p class="name">你認識我的時候,我我我哦我</p><p class="zhubo">主播/楊汁的陽光</p><p class="data"><span>10.3k次播放</span><span class="sl">|</span><span>評論:34</span><span class="sl">|</span><span>喜歡:354</span></p> </li><li><img src="./img/cell-3.jpg" alt=""><p class="name">房東的貓 人生最美好 美好美好美好</p><p class="zhubo">主播/文森FM</p><p class="data"><span>7.7k次播放</span><span class="sl">|</span><span>評論:35</span><span class="sl">|</span><span>喜歡:305</span></p> </li></ul><p class="title"><span class="cube"></span><span>TOP TING</span></p><ul class="ting"><li><img src="./img/cell-4.jpg" alt=""><p class="name">張家界旅游防坑指南</p><p class="zhubo">主播/墨菲</p><p class="data"><span>4.5k次播放</span><span class="sl">|</span><span>評論:4</span><span class="sl">|</span><span>喜歡:47</span></p> </li><li style="margin: 0 35px;"><img src="./img/cell-5.jpeg" alt=""><p class="name">你認識我的時候,我我我哦我</p><p class="zhubo">主播/楊汁的陽光</p><p class="data"><span>10.3k次播放</span><span class="sl">|</span><span>評論:34</span><span class="sl">|</span><span>喜歡:354</span></p> </li><li><img src="./img/cell-6.jpg" alt=""><p class="name">房東的貓 人生最美好 美好美好美好</p><p class="zhubo">主播/文森FM</p><p class="data"><span>7.7k次播放</span><span class="sl">|</span><span>評論:35</span><span class="sl">|</span><span>喜歡:305</span></p> </li></ul><p class="title"><span class="cube"></span><span>熱門電臺|Hot Radio</span></p><ul class="hot"><li><div class="img1"><img src="./img/NewCell-1.jpg" alt=""></div><div class=""><img src="./img/NewCell-1.jpg" alt=""></div><div class="img3"><img src="./img/NewCell-1.JPG" alt=""></div><p class="name"></p><p class="zhubo"></p><p class="data"></p></li></ul></div></div> </body> </html>總結
以上是生活随笔為你收集整理的关于仿写00片刻企业站的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: i5 1340p和r7 7735h差距
- 下一篇: mpeg-ts总结