<body>? ? ?? ? ?<nav class="navbar navbar-default navbar-fixed-top">? ? ? <div class="container""> ? ? <div class="navbar-header"> ? ? <a href="#" class="navbar-brand logo"><img src="img/fluid/green.jpg" ?alt="logo"></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"> ? ? <form class="navbar-form navbar-left hidden-sm hidde-xs hidden-md"> ? ? <div class="form-group"> ? ? <input type="text" class="form-control"/> ? ? </div> ? ? <button class="btn btn-primary" type="submit">搜索</button> ? ? </form> ? ? <ul class="nav navbar-nav navbar-right"> ? ? <li><a href="hobby.html"><span class="glyphicon glyphicon-home"></span>首頁</a></li> ? ? <li><a href="reading2.html"><span class="glyphicon glyphicon-list"></span>閱讀</a></li> ? ? <li class="active"><a href="sports.html"><span class="glyphicon glyphicon-fire"></span>網(wǎng)球</a></li> ? ? <li><a href="videos.html"><span class="glyphicon glyphicon-question-sign"></span>影視</a></li> ? ? </ul> ? ? </div>? ? ? </div>? ? ?</nav>? ? ?? ? ?<div class="jumbotron">? ? ? <div class="container">? ? ? <hgroup>? ? ? <h1>網(wǎng)球</h1>? ? ? <h4>網(wǎng)壇的最新動(dòng)態(tài)，資源等...</h4>? ? ? </hgroup>? ? ? </div>? ? ?</div>? ? ?? ? ?<div id="sports">? ? ? <div class="container">? ? ? <div class="row">? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/federer.jpg" alt="" />? ? ? <div class="caption">? ? ? <h4>費(fèi)德勒</h4>? ? ? <p>瑞士男子職業(yè)網(wǎng)球運(yùn)動(dòng)員,五個(gè)澳網(wǎng)冠軍、18個(gè)大滿貫冠軍</p>? ? ? </div>? ? ? </div>? ? ? </div> ? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/xiaode.jpg" ?alt="" />? ? ? <div class="caption">? ? ? <h4>德約科維奇</h4>? ? ? <p>塞爾維亞職業(yè)網(wǎng)球運(yùn)動(dòng)員。贏得12個(gè)大滿貫、30個(gè)大師系列賽</p>? ? ? </div>? ? ? </div>? ? ? </div>? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/nad.jpg" ? alt="" />? ? ? <div class="caption">? ? ? <h4>納達(dá)爾</h4>? ? ? <p>西班牙職業(yè)網(wǎng)球運(yùn)動(dòng)員。28座大師賽冠軍（歷史第二） 14座大滿貫</p>? ? ? </div>? ? ? </div>? ? ? </div> ? ? ? ? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12"> ? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/lina.jpg" ?alt="" />? ? ? <div class="caption">? ? ? <h4>李娜</h4>? ? ? <p>中國網(wǎng)球運(yùn)動(dòng)員。21次入WTA女單決賽，9個(gè)WTA和19個(gè)ITF單打冠軍</p>? ? ? </div>? ? ? </div>? ? ? </div>? ? ? ? ? ? ? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12"> ? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/wawrinka2.jpg" ? alt="" />? ? ? <div class="caption">? ? ? <h4>瓦林卡</h4>? ? ? <p>瑞士男子網(wǎng)球運(yùn)動(dòng)員。14年澳網(wǎng)男單冠軍, 15法網(wǎng)男單冠軍</p>? ? ? </div>? ? ? </div>? ? ? </div>? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12"> ? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/xiaowei2.jpg" ? alt="" />? ? ? <div class="caption">? ? ? <h4>小威廉姆斯</h4>? ? ? <p>美國女子職業(yè)網(wǎng)球運(yùn)動(dòng)員。23次女單大滿貫冠軍, 14次女雙大滿貫冠軍</p>? ? ? </div>? ? ? </div>? ? ? </div>? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12"> ? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/Ala.jpg" ? alt="" />? ? ? <div class="caption">? ? ? <h4>A·拉德萬斯卡</h4>? ? ? <p>波蘭網(wǎng)球職業(yè)運(yùn)動(dòng)員,最高排名：2012年 世界排名第2,WTA單打冠軍</p>? ? ? </div>? ? ? </div>? ? ? </div>? ? ? <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12"> ? ? ? <div class="thumbnail">? ? ? <img src="img/wrok/Murray2.jpg" ? alt="" />? ? ? <div class="caption">? ? ? <h4>安迪·穆雷</h4>? ? ? <p>英國職業(yè)網(wǎng)球運(yùn)動(dòng)員,12年美網(wǎng)男單冠軍, 12年倫敦奧運(yùn)會(huì)男單冠軍</p>? ? ? </div>? ? ? </div>? ? ? </div>? ? ? ? ? ? </div>? ? ? </div>? ? ?</div>? ? ?? ? ?<div id="about">? ? ? <div class="container">? ? ? <div class="col-md-3 hidden-sm hidden-xs">? ? ? <div class="list-group">? ? ? <a class="list-group-item" href="#1">溫網(wǎng)</a>? ? ? <a class="list-group-item" href="#2">澳網(wǎng)</a>? ? ? <a class="list-group-item" href="#3">法網(wǎng)</a>? ? ? </div>? ? ? </div>? ? ? <div class="col-md-9 about">? ? ? <a name="1"></a>? ? ? <h3>溫網(wǎng)簡介</h3>? ? ? <p>溫布爾登網(wǎng)球錦標(biāo)賽（Wimbledon Championships，或簡稱“溫網(wǎng)”）是網(wǎng)球運(yùn)動(dòng)中最古老和最具聲望的賽事，是網(wǎng)球四大滿貫之一。溫網(wǎng)舉辦地在英國倫敦郊區(qū)的溫布爾登，通常舉辦于6月或7月，是每年度網(wǎng)球大滿貫的第3項(xiàng)賽事，排在澳大利亞網(wǎng)球公開賽和法國網(wǎng)球公開賽之后，美國網(wǎng)球公開賽之前，也是四大滿貫中唯一的草地比賽。整個(gè)賽事通常歷時(shí)兩周，但會(huì)因雨延時(shí)。男子單打、女子單打、男子雙打、女子雙打和男女混合雙打比賽在不同場地同時(shí)進(jìn)行。溫布爾登還舉辦有男子單打、女子單打、男子雙打、女子雙打的青年比賽。此外，溫布爾登還為退役球員舉辦特別邀請(qǐng)賽。</p>? ? ? <a name="2"></a>? ? ? <h3>澳網(wǎng)簡介</h3>? ? ? <p>澳大利亞網(wǎng)球公開賽（英語：Australian Open，簡稱：澳網(wǎng)）是網(wǎng)球四大滿貫賽事之一。比賽通常于每年一月的最后兩周在澳大利亞維多利亞州的墨爾本體育公園舉行，是每年四大滿貫中最先舉行的一個(gè)賽事，也是最年輕的大滿貫。澳大利亞網(wǎng)球公開賽創(chuàng)辦于1905年，已經(jīng)有100多年的歷史。比賽創(chuàng)立之初比賽被命名為“澳大拉西亞錦標(biāo)賽”（Australasian Championships）；1969年，比賽進(jìn)入“公開賽時(shí)代”。自1988年起，比賽一直在墨爾本公園的室外硬地球場上進(jìn)行。比賽設(shè)有男子單雙打、女子單雙打以及混合雙打等項(xiàng)目。男子單打冠軍獎(jiǎng)杯是諾曼·布魯克斯挑戰(zhàn)杯（Norman Brookes Challenge Cup），女子單打冠軍獎(jiǎng)杯是達(dá)芙妮·阿克赫斯特紀(jì)念杯（Daphne Akhurst Memorial Cup）。</p>? ? ? <a name="3"></a>? ? ? <h3>法網(wǎng)簡介</h3>? ? ? <p>法國網(wǎng)球公開賽（French Open），簡稱“法網(wǎng)”，是一項(xiàng)在法國巴黎羅蘭·加洛斯球場舉辦的網(wǎng)球大滿貫賽事。通常在每年的5月至6月進(jìn)行，是每年第二個(gè)進(jìn)行的大滿貫賽事。該賽事創(chuàng)辦于1891年，是網(wǎng)球比賽唯一一個(gè)在紅土球場上進(jìn)行的大滿貫比賽，標(biāo)志著紅土賽事中的最高榮譽(yù)，同時(shí)也標(biāo)志著每年紅土賽季的結(jié)束。由于紅土場地球速較慢，且男子單打比賽采用五盤三勝制，因此參加比賽的選手需要有著超群的技術(shù)和驚人的毅力。</p>? ? ? </div>? ? ? </div>? ? ?</div>? ? ?? ? ?<ul class="nav nav-pills" id="headd"> <li class="active"><a href="#">網(wǎng)球拍</a></li> <li><a href="#">網(wǎng)球鞋</a></li> <li><a href="#">球線</a></li> <li><a href="#">球包</a></li>? </ul> ? ? ? ?<div class="container">? ? ? <div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai1.jpg" /> ? ? <div class="caption"> ? ? <h3>PS95</h3> ? ? <p>原價(jià)1667</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">1358</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div>? ? ? ? ? ? <div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai2.jpg" /> ? ? <div class="caption"> ? ? <h3>PS97</h3> ? ? <p>原價(jià)1357</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">1148</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div>? ? ? ? ? ? <div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai3.jpg" /> ? ? <div class="caption"> ? ? <h3>Blade</h3> ? ? <p>原價(jià)1247</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">1038</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div>? ? ? ? ? ? <div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai9.jpg" /> ? ? <div class="caption"> ? ? <h3>HEAD新手拍</h3> ? ? <p>原價(jià)537</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">428</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div> ? ? ? ? ? ? ? ?<div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai10.jpg" /> ? ? <div class="caption"> ? ? <h3>頂配清潔球</h3> ? ? <p>原價(jià)67</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">58</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div>? ? ? ? ? ? <div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai6.jpeg" /> ? ? <div class="caption"> ? ? <h3>RF97</h3> ? ? <p>原價(jià)1557</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">1348</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div>? ? ? ? ? ? <div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai7.jpg" /> ? ? <div class="caption"> ? ? <h3>blade溫網(wǎng)版</h3> ? ? <p>原價(jià)1247</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">938</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div>? ? ? ? ? ? <div class="col-md-3 col-sm-4 col-xs-6">? ? ? <div class="thumbnail"> ? ? <img src="img/wrok/pai8.jpg" /> ? ? <div class="caption"> ? ? <h3>HEAD I5</h3> ? ? <p>原價(jià)1337</p> ? ? <p><a href="#" class="btn btn-default">搶購</a></p> ? ? <h2>限時(shí)搶購<span class="label label-danger">1128</span></h2> ? ? </div>? ? ? </div> ? ? ? ?</div>別看代碼很長，我問的只是那兩片圖片的區(qū)域，一是不對(duì)齊，二是在頁面縮小后不響應(yīng)式，希望有大佬能來幫幫我。。。
怎么讓這段代碼實(shí)現(xiàn)響應(yīng)式
慕工程6005648
2017-04-14 16:25:28
