時間：2023-09-13 09:42:02 | 來源：網(wǎng)站運營
時間：2023-09-13 09:42:02 來源：網(wǎng)站運營
基于HTML+CSS+JavaScript+Bootstarp響應式健身網(wǎng)站(web前端期末大作業(yè))：網(wǎng)站題目>
在線咨詢
Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html軟件進行運行及修改等操作）。<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /><title>減肥健身俱樂部</title><link rel="stylesheet" href="css/bootstrap.min.css" rel="external nofollow" ><script src="js/jquery.min.js"></script><script src="js/bootstrap.min.js"></script><link rel="stylesheet" href="css/style.css" rel="external nofollow" ></head><body><div class="jumbotron text-center toubg" style="margin-bottom:0;"><h1> <a href="index.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" ><img class="logo" src="img/logo1.png" ></a></h1><h4>減肥,健身就和學英語一樣,方法有很多,而且明顯正確的方法也不少,但最難的在堅持。</h4></div><nav class="navbar navbar-inverse"><div class="container-fluid"><div class="navbar-header"><button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" style=" font-weight: bold; font-size: 25px; color: #fffffc;" href="index.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" ></a></div><div class="collapse navbar-collapse" id="myNavbar"><ul class="nav navbar-nav"><li class="active"><a href="index.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" >首頁</a></li><li><a href="sub1.html" rel="external nofollow" >減肥攻略</a></li><li><a href="sub2.html" rel="external nofollow" >健身攻略</a></li><li><a href="sub3.html" rel="external nofollow" >健身教學</a></li></ul><div style="height:50px; display: flex; align-items: center;" class="col-sm-5" id="so"> <div class="input-group"> <input type="text" class="form-control"/> <span class="input-group-addon"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" > <span >搜索 </span></i></a></span> </div></div></div></div></nav><div class="container"><div id="myCarousel" class="carousel slide"><!-- 輪播（Carousel）指標 --><ol 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></ol><!-- 輪播（Carousel）項目 --><div style="height: 400px; " class="carousel-inner imgkuang"><div class="item active"><img class="imglun" src="img/js-ind2.jpg" alt="First slide"></div><div class="item"><img src="img/js-ind3.jpg" alt="Second slide"></div><div class="item"><img src="img/js-ind4.jpg" alt="Third slide"></div></div><!-- 輪播（Carousel）導航 --><a class="left carousel-control" href="#myCarousel" rel="external nofollow" rel="external nofollow" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> </a> <a class="right carousel-control" href="#myCarousel" rel="external nofollow" rel="external nofollow" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true">></span></a></div><hr><div class="row"><div class="col-sm-4"><h4>健身明星：彭于晏</h4><div class="fakeimg"><img src="img/pyy.jpg"></div><p style="margin-top: 20px;">2011年，主演的電影《翻滾吧！阿信》是彭于晏事業(yè)的轉(zhuǎn)折點，他憑借該戲入圍第48屆臺灣電影金馬獎最佳男主角。而后接連拍攝了《寒戰(zhàn)》、《分手合約》、《激戰(zhàn)》等多部電影，更憑《激戰(zhàn)》中“林思齊”一角角逐第50屆臺灣電影金馬獎及第33屆香港電影金像獎最佳男配角，彭于晏絕對是中國娛樂圈最強壯的男明星。 平?？釔圻\動的他，保持著良好的身材，不僅顏值爆表，這身材放你眼前，是不是已經(jīng)眼瞎？</p><hr><div class="fakeimg"><img src="img/ind.png"></div><h4>流行項目</h4><ul class="nav nav-pills nav-stacked sy-fl"><li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >大眾健身操</a></li><li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >拉丁健美操</a></li><li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >健身球</a></li><li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >瑜伽</a></li><li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >有氧舞蹈</a></li></ul><hr class="hidden-sm hidden-md hidden-lg"></div><div class="col-sm-8"><h4>健身的十大好處，你全都知道嗎？ </h4><br><p style="margin-top: 20px;">在現(xiàn)代，健身方法越來越多，而愿意積極的健身的人也越來越多。不過很多人健身應該只是為了塑造自己的好身材吧!其實，積極的參加健身運動好處可不止這一點哦!那么健身的好處有哪些呢?下面就一起來了解下吧!</p><br><br> <h5>1、釋放生活工作的壓力 </h5><p> 活在現(xiàn)在這個高壓的社會中，每天要面對的事情實在太多，有些人就容易扛不住，出現(xiàn)心理抑郁、負能量纏身等等。有個很好的方法，出一出汗就能解決。跑步的人有這樣的經(jīng)歷和感受，遇到煩心事一跑步心情就會有改變。</p><p> 那么具體的原理是什么呢?很簡單，積極的運動會讓我們的身體產(chǎn)生一種有益于身心的物質(zhì)，也就是被稱為“快樂激素”的“內(nèi)啡肽”。通過運動，身體會大量產(chǎn)生這種元素，讓你感到輕松愉快哦!所以想要排解壓力的話，那就積極的運動吧!</p><h5> 2、健身性感，能吸引周圍人的目光</h5><p> 哪個女生不喜歡有身材緊實、臂膀厚實和小腹平坦的男性呢?性感的男人反而會讓女人無法自持，影視劇里用玫瑰花瓣覆蓋裸身露出鎖骨的畫面，經(jīng)常讓電影院的全場女生尖叫。</p><p> 如果某天他突然開始健身了，一定是喜歡上了身邊某個人，通過健身這樣的方式，找一個話題或者通過健身讓自己變的更自信。</p><h5> 3、增加活力</h5><p> 每周健身2-3次，可增加20%體力和降低65%的疲勞度，原因是健身提升我們新陳代謝使體能加強，且腦中多巴胺(dopamine)的分泌增加，可以讓我們不會感受到那么的勞累！<p><h5> 4、健身可以建立自信應對挑戰(zhàn)</h5><p> 對人生失去熱情，沮喪會使男人的內(nèi)心感覺無助、無能、無法做任何事情。因此最簡單的解決方法是開始健身。</p><p> 只要你在健身之初就為自己逐步的設定鍛煉的目標，那么隨著目標的逐步實現(xiàn)，男士們就能夠不斷的獲得愉快的心情，并為自己建立起自信。其次，長期的進行運動，還能幫男士養(yǎng)成良好的生活習慣，讓身體也變得的更健康，同樣能夠給男士帶來積極地心態(tài)變化。</p><h5> 5、健身促進更佳的睡眠</h5><p> 一次好的夜間睡眠會提高你的注意力，提升你的生產(chǎn)力以及改善你的心情。鍛煉是好睡眠的關鍵。定期的鍛煉可以幫助你更快地入睡，而且讓你睡得更深。</p><h5> 6.健身能疏通血管，預防心血管疾病</h5><p> 經(jīng)常地、科學地從事體育運動，對心血管系統(tǒng)的形態(tài)結構和機能也有良好的影響，如經(jīng)過適宜強度的耐力訓練，可改善和增強心肌的供血能力和代謝能力，減少血管壁的脂肪沉積，對預防動脈硬化有著積極的作用，也能防止心肌缺血性疾病的發(fā)生。</p><h5> 7.增強記憶力</h5><p> 我們都希望自己有比較好的記憶力來面對工作的問題或考試，最新發(fā)表在腦行為研究期刊(journal Behavioral Brain Research)的研究顯示，有氧運動可以增加血液中有關于記憶的賀爾蒙的增加！</p> <h5> 8.不容易感冒</h5><p> 目前對于健身的人比較不容易感冒的確切機制并不清楚，但發(fā)表在英國運動醫(yī)學雜志 ( British Journal of Sports Medicine) 最新的研究指出，一星期健身五次以上的人，比健身一次或不健身的人，感冒的機率少了46%，此外常健身的人感冒后癥狀發(fā)生天數(shù)少了41%，癥狀嚴重度少了32%-40%，研究人員推測可能是健身有助于提高體內(nèi)免疫系統(tǒng)！</p><h5> 9.有助于工作表現(xiàn)</h5><p> 去年針對19803名上班族調(diào)查報告顯示，有健身習慣的上班族在公司表現(xiàn)比沒有健身的同事在創(chuàng)造力、簡報能力、生產(chǎn)力平均好了50%，研究結果發(fā)表在健康管理期刊(journal Population Health Management)，因此今年開始美國越來越多公司都有附設健身房讓員工使用！</p><h5> 10.增加肌肉有助于減肥</h5><p> 隨著肌力訓練帶來的肌肉增多，肌體在靜態(tài)下的新陳代謝率也會逐步增加，所以每天你都會消耗更多的熱量。研究發(fā)現(xiàn)，肌體每增加1磅肌肉，每日會多消耗35-50千卡熱量。</p></div></div><hr></div><div class="jumbotron text-center jum-bottom" > <h4>減肥健身俱樂部</h4> <h5 style="">Copyright ? 減肥健身俱樂部. 保留所有權利</h5></div></body></html>123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190 CSS樣式代碼img { width: 100%; height: auto; } .navbar-inverse { background-color: #a58f86; border-color: #a58f86; } .navbar-inverse .navbar-nav>li>a { color: #fff; } .navbar-inverse .navbar-toggle { border-color: #333333; } .navbar-brand { font-style: italic; } .navbar-nav { float: left; } .navbar-nav li { float: none; display: inline-block; } .glyphicon-chevron-left:before { content: none; } .glyphicon-chevron-right:before { content: none; } .carousel-control .glyphicon-chevron-right { font-size: 50px; } .carousel-control .glyphicon-chevron-left { font-size: 50px; } .menpai p .btn { padding-left: 0px; padding: 5px; } .menpai img { width: 100%; height: auto; border-radius: 5px; margin-bottom: 10px; border: 1px #e3e3e3 solid; } .imgkuang img { width: 100%; height: auto; } .fakeimg { overflow: hidden; height: auto; } .fakeimg img { width: 100%; height: auto; } .sy-fl li a { color: #080808; background: #e3e3e3; margin-top: 10px; } .sy-fl li a:hover { background: #66512C; color: #fff; } .row h4 { margin-top: 20px; font-weight: bold } .jum-bottom { padding: 20px; color: floralwhite; margin-top: 30px; background-color: #a58f86; margin-bottom: 0px; } .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form { border-color: #a58f86; } .navbar-inverse .navbar-toggle { border-color: #a58f86; } .toubg { padding-top: 100px; padding-bottom: 100px; color: #fff; background: url(../img/js-ind1.jpg) bottom; background-size: cover; } h5 { font-weight: bold; font-size: 16px; } .wsdy img { width: 100%; height: auto; }#myNavbar { display: flex !important; justify-content: space-between; } .col-md-4 img { height: 250px; width: auto; } .logo { height: 250px; width: auto; transition: all 0.25s; } .logo:hover { transform: scale(1.2); }123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141請 “ 點贊” “??評論” “ 收藏” 一鍵三連哦！ 【 我| 獲取更多源碼 | 優(yōu)質(zhì)文章】 帶您學習各種前端插件、3D炫酷效果、圖片展示、文字效果、以及整站模板 、大學生畢業(yè)HTML模板 、期末大作業(yè)模板 、等! 「在這里有好多 前端 開發(fā)者，一起探討 前端 Node 知識，互相學習」！關鍵詞：作業(yè),響應
微信公眾號
版權所有? 億企邦 1997-2025 保留一切法律許可權利。
