時(shí)間：2022-08-26 18:15:01 | 來源：網(wǎng)站運(yùn)營
時(shí)間：2022-08-26 18:15:01 來源：網(wǎng)站運(yùn)營
?
在線咨詢
1.網(wǎng)頁作品簡介方面 ：黑色通用的IT程序員資訊交流個(gè)人博客網(wǎng)站模板。喜歡的可以下載，文章頁支持手機(jī)PC響應(yīng)式布局。主要有：登錄、注冊、主頁、火星成員、華子一家 聯(lián)系我們 等總共6個(gè)頁面html下載。2.網(wǎng)頁作品編輯方面：此作品為學(xué)生個(gè)人主頁網(wǎng)頁設(shè)計(jì)題材，代碼為簡單學(xué)生水平 html+css 布局制作，作品下載后可使用任意HTML編輯軟件（例如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm 所有編輯器均可使用）3.網(wǎng)頁作品布局方面：網(wǎng)頁布局整體為LOGO、導(dǎo)航、主體內(nèi)容布局。子頁面多種布局，興趣愛好內(nèi)容使用圖片列表布局，成績頁面插入了表格，聯(lián)系我們使用圖片對齊方式設(shè)置了左對齊。4.網(wǎng)頁作品技術(shù)方面：使用CSS制作了網(wǎng)頁背景圖、鼠標(biāo)經(jīng)過及選中導(dǎo)航變色效果、下劃線等。 首頁制作了留言表單，同時(shí)簡單使用JavaScript制作了表單判斷（提交時(shí)表單不能為空）<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no"> <title>Born to love</title> <!-- 滑動(dòng)插件庫 --> <link rel="stylesheet" type="text/css" href="css/animate.css"> <!-- bootstrap --> <link rel="stylesheet" href="css/bootstrap.min.css"> <!-- 自己的樣式 --> <link rel="stylesheet" href="css/style.css"> <!-- 公共樣式 --> <link rel="stylesheet" href="css/reset.css"></head><body> <header id="header" class="header"> <nav class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <a href="index.html" class="navbar-brand logo hidden-xs"> <img src="images/logo.png" alt="logo" class="img-responsive"> </a> <a href="index.html" class="navbar-brand logo hidden-md hidden-sm hidden-lg">Born to love</a> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="collapse navbar-collapse" id="navbar-collapse"> <ul class="nav navbar-nav navbar-right"> <li class=""><a href="index.html">首頁</a></li> <li><a href="team.html">火星成員</a></li> <li><a href="activity.html">華家有一子</a></li> <li><a href="us.html">聯(lián)系我們</a></li> <li><a href="login.html">登錄</a></li> <li><a href="register.html">注冊</a></li> </ul> </div> </div> </nav> </header> <section> <div id="myCarousel" class="carousel slide wow fadeInDown"> <ul class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="active"></li> <li data-target="#myCarousel" data-slide-to="1"></li> <li data-target="#myCarousel" data-slide-to="2"></li> </ul> <div class="carousel-inner"> <div class="item active"> <img src="images/lunbo2.jpg" alt="第一張" class="img-responsive"> </div> <div class="item"> <img src="images/lunbo3.jpg" alt="第二張" class="img-responsive"> </div> <div class="item"> <img src="images/lunbo1.jpg" alt="第三張" class="img-responsive"> </div> </div> <a href="#myCarousel" data-slide="prev" class="carousel-control left"> <span class="glyphicon glyphicon-chevron-left"></span> </a> <a href="#myCarousel" data-slide="next" class="carousel-control right"> <span class="glyphicon glyphicon-chevron-right"></span> </a> </div> </section> <section id="welcome"> <div class="container"> <div class="col-md-12"> <div class="welcome-title text-center wow fadeInDown"> <h2>Born to Love</h2> <p>Welcome Home</p> </div> </div> <div class="row"> <div class="col-md-6 wow fadeInLeft col-sm-6"> <div class="li"> <a href="#" class="pull-left"> <img src="images/Welcome06.jpg" alt="bg" class="img-responsive"> </a> <div class="media-body"> <h3>It's Not Ending</h3> <p>關(guān)于家，不會(huì)有結(jié)尾</p> <p>因?yàn)橐磺卸疾艅倓傞_始</p> <p>但是，故事總會(huì)說再見</p> <p>希望家一直都在，家里的人一直都好</p> </div> </div> </div> <div class="col-md-6 wow fadeInRight col-sm-6" data-wow-delay="0.2s" > <div class="li"> <a href="#" class="pull-left"> <img src="images/Welcome01.png" alt="bg" class="img-responsive"> </a> <div class="media-body"> <h3>Welcome Home</h3> <p>我們都是素不相識(shí)的陌生人</p> <p>都默默地在各自的軌道上無聲的運(yùn)行著</p> <p> 好像永不會(huì)相交的平行線</p> <p>但奇妙的命運(yùn)讓我們在這里相聚</p> <p>成為朋友，成為家人</p> </div> </div> </div> <div class="col-md-6 wow fadeInLeft col-sm-6"> <div class="li"> <a href="#" class="pull-left"> <img src="images/Welcome03.jpg" alt="bg" class="img-responsive"> </a> <div class="media-body"> <h3>BORN TO LOVE</h3> <p>我們腳下站著每一寸土地，都來自火星</p> <p>都來自我們共同的家</p> <p>家里的一切都很好</p> </p> </div> </div> </div> <div class="col-md-6 wow fadeInRight col-sm-6" data-wow-delay="0.2s"> <div class="li"> <a href="#" class="pull-left"> <img src="images/Welcome02.jpg" alt="bg" class="img-responsive"> </a> <div class="media-body"> <h3>To Be Myself</h3> <p>在家里，我們沒有條條框框的約束</p> <p>沒有一個(gè)“好孩子”“好父母”“好老板”的標(biāo)簽</p> <p>不會(huì)被別人隨便定義</p> <p>也不會(huì)隨便地定義別人</p> <p>我們所做的事都是建立在善良的基礎(chǔ)上</p> </div> </div> </div> </div> </div></section><section id="team"> <div class="container"> <div class="col-md-12"> <div class="huoxin-title wow slideInLeft"> <h2>火星成員</h2> </div> </div> <div class="row"> <div class="time"> <div class="col-md-4 wow zoomInRight col-sm-6"> <div class="thumbnail thm"> <img src="images/1.jpg" alt="頭像"> <a href="#"><h2>PrePre</h2></a> <span>It is a lovely cat </span> <p>只為了更好遇見 才賦予了距離和時(shí)間 今天 值得等待</p> </div> </div> <div class="col-md-4 wow zoomInUp col-sm-6"> <div class="thumbnail thm"> <img src="images/2.jpg" alt="頭像"> <a href="#"><h2>黑煤球</h2></a> <span>A group of lovely and inflated Fairies</span> <p>當(dāng)你面對困惑時(shí) 它會(huì)告訴你 你就是你 最好的你</p> </div> </div> <div class="col-md-4 wow zoomInLeft col-sm-6"> <div class="thumbnail thm"> <img src="images/3.jpg" alt="頭像"> <a href="#"><h2>火星鼠</h2></a> <span>A lovely mouse</span> <p>它挺愛笑 只是 有時(shí) 會(huì)失落和悲傷</p> </div> </div> <div class="hidden-md wow zoomInLeft col-sm-6 hidden-lg hidden-xs"> <div class="thumbnail thm"> <img src="images/5.jpg" alt="頭像"> <a href="#"><h2>火星鼠</h2></a> <span>nubmer one</span> <p>你就是你 唯一的你</p> </div> </div> </div> </div> </div></section><!-- 華家有一子 --><section id="activity"> <div class="container"> <div class="col-md-12"> <div class="title wow slideInLeft"> <h2>華家有一子</h2> <p>我并不是什么天才，我只是比別人學(xué)的要早</p> </div> </div> <div class="row"> <div class="events-bottom"> <div class="col-md-6 event-left wow zoomIn"> <div class="col-md-6 event-right wow zoomIn"> <div class="e-2"> <a href=""><img src="images/tuan3.jpeg" alt="" > <h4>我與你 際緣而遇 于是你 因愛而生</h4> </a> </div> </div> <div class="col-md-6 event-right wow zoomIn"> <div class="e-2"> <a href=""><img src="images/tuan1.jpg" alt="" > <h4>保持酷與獨(dú)立 或享受寂寞</h4> </a> </div> </div> <img src="images/tuan5.jpg" alt="" > <div class="event"> <a href=""><h4>華晨宇</h4></a> <p>華晨宇，1990年2月7日生于湖北省十堰市，中國內(nèi)地男歌手、作曲人，畢業(yè)于武漢音樂學(xué)院。2013年參加湖南衛(wèi)視《快樂男聲》獲年度總冠軍出道。2014年1月首登央視春晚舞臺(tái)；同年4月參加戶外真人秀節(jié)目《花兒與少年》；9月6日-7日在北京萬事達(dá)中心連開兩場“火星”演唱會(huì)，隨后發(fā)行首張個(gè)人專輯《卡西莫多的禮物》，并憑此專輯獲2015QQ音樂年度最佳內(nèi)地男歌手及第十五屆音樂風(fēng)云榜年度最受歡迎男歌手等獎(jiǎng)項(xiàng)。</p> </div> </div> <div class="col-md-6"> <div class="col-md-6 event-right wow zoomIn"> <div class="e-2 wow zoomIn"> <a href=""><img src="images/tuan2.jpg" alt="" > <h4>感受愛與自由 或 活出真我</h4> </a> </div> </div> <div class="col-md-6 event-right wow zoomIn"> <div class="e-2 wow zoomIn"> <a href=""><img src="images/tuan4.jpg" alt="" > <h4>愿你能觸摸火星晨 接觸新世界</h4> </a> </div> </div> <div class="col-md-12"> <a href=""><img src="images/tuan6.jpg" alt="" class="img-responsive"></a> <div class="event"> <a href=""><h4>華晨宇</h4></a> <p>2016年9月27日出席亞洲新歌榜2016年度盛典，攬獲最佳男歌手獎(jiǎng)；同年10月加盟東方衛(wèi)視《天籟之戰(zhàn)》；同年12月2日獲2016MAMA亞洲最佳藝人獎(jiǎng)。2017年3月14日發(fā)行專輯《H》；同年6月，參加旅行真人秀《旅途的花樣》。2018年2月參加湖南衛(wèi)視《歌手2018》，獲總決賽亞軍 ；同年9月8日-9日在鳥巢體育場連開兩場2018火星演唱會(huì) 。2019年11月15日-17日在?？谖逶春芋w育場連開3場2019火星演唱會(huì) 。</p> </div> </div> </div> <div class="clearfix"></div> </div> </div> </div></section><section id="we"> <div class="container"> <div class="col-md-12"> <div class="title1 wow slideInLeft"> <h2>聯(lián)系我們</h2> </div> </div> <div class="row"> <div class="col-md-10 col-md-offset-1" > <form method="get" > <div class="form-group wow fadeInRight form-height"> <input type="text" class="form-control form-control-white" placeholder="name" value="" required> </div> <div class="form-group wow fadeInLeft form-height"> <input type="text" class="form-control form-control-white" placeholder="call" value="" required> </div> <div class="form-group wow fadeInRight form-height"> <input type="email" class="form-control form-control-white" placeholder="Email" value="" required> </div> <div class="form-group wow fadeInLeft"> <textarea class="form-control form-control-white" placeholder="請留言..." required rows="5"></textarea> </div> <div class="form-group wow fadeInLeft form-height"> <button type="submit" class="btn btn-default btn-lg" required>提交信息</button> </div> </form> </div> </div> </div></div></section><footer id="footer"> <div class="container"> <div class="row"> <div class="footer-top wow wobble"> <div class="col-md-4 footer-left col-sm-4"> <span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span> <p> <label>聯(lián)系地址</label> 火星空間站 </p> </div> <div class="col-md-4 footer-left col-sm-4"> <span class="glyphicon glyphicon-earphone" aria-hidden="true"></span> <p><label>聯(lián)系電話</label> ETHCY317</p> </div> <div class="col-md-4 footer-left col-sm-4"> <span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> <p><label>郵箱</label> <a href="mailto:2137784448@qq.com">2137784448@qq.com</a></p> </div> </div> <!-- 分界線 --> <div class="col-md-4 xian col-sm-4"></div> <div class="col-md-12 col-sm-12"> <img src="images/vx.png" alt="微信公眾號(hào)"/> </div> <div class="col-md-12"> <p>Born to Love 歡迎您</p> </div> </div> </div> </footer> <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> <script src="js/bootstrap.min.js"></script> <script type="text/javascript" src="js/wow.min.js"></script> <script type="text/javascript"> //動(dòng)畫庫 $(function(){ new WOW().init(); }); </script> </body> </html>web前端 零基礎(chǔ)-入門到高級 (視頻+源碼+開發(fā)軟件+學(xué)習(xí)資料+面試題) 一整套 (教程) 適合入門到高級的童鞋們?nèi)胧謣送1000套HTML+CSS+JavaScript模板網(wǎng)站 [點(diǎn)贊+好評+收藏] 三連 支持下吧，你的「點(diǎn)贊，好評，收藏」是我創(chuàng)作的動(dòng)力。關(guān)注我 ~ 每天帶你學(xué)習(xí) :各種前端插件、3D炫酷效果、圖片展示、文字效果、以及整站模板 、大學(xué)生畢業(yè)HTML模板 、期末大作業(yè)模板 、等! 「在這里有好多 前端 開發(fā)者，一起探討 前端 Node 知識(shí)，互相學(xué)習(xí)」！關(guān)注↓公Z號(hào) 獲取更多源碼 !客戶&案例
營銷資訊
關(guān)于我們
微信公眾號(hào)
版權(quán)所有? 億企邦 1997-2022 保留一切法律許可權(quán)利。
