                        課程
                    
                        /前端開發(fā)
                        
                            /Bootstrap
                        
                        /基于bootstrap的網(wǎng)頁開發(fā)

為什么老師的原代碼在我自己的Dreamweaver上運(yùn)行不了，就算把jquery,bootstrap的引用前面加上http://也不行

<!DOCTYPE html>

<html>

<head>

? ? <meta charset="utf-8">

? ? <meta http-equiv="X-UA-Compatible" content="IE=edge">

? ? <meta name="viewport" content="width=device-width, initial-scale=1">

? ? <title>現(xiàn)代瀏覽器博物館</title>

? ? <link href="css/bootstrap.min.css" rel="stylesheet">

? ? <!--[if lt IE 9]>

? ? <script src="js/html5shiv.js"></script>

? ? <script src="js/respond.min.js"></script>

? ? <![endif]-->

? ? <style>

? ? ? ? body {

? ? ? ? ? ? padding-top: 50px;

? ? ? ? ? ? padding-bottom: 40px;

? ? ? ? ? ? color: #5a5a5a;

? ? ? ? }

? ? ? ? /* 輪播廣告 */

? ? ? ? .carousel {

? ? ? ? ? ? height: 500px;

? ? ? ? ? ? margin-bottom: 60px;

? ? ? ? }

? ? ? ? .carousel .item {

? ? ? ? ? ? height: 500px;

? ? ? ? ? ? background-color: #000;

? ? ? ? }

? ? ? ? .carousel .item img {

? ? ? ? ? ? width: 100%;

? ? ? ? }

? ? ? ? .carousel-caption {

? ? ? ? ? ? z-index: 10;

? ? ? ? }

? ? ? ? .carousel-caption p {

? ? ? ? ? ? margin-bottom: 20px;

? ? ? ? ? ? font-size: 20px;

? ? ? ? ? ? line-height: 1.8;

? ? ? ? }

? ? ? ? /* 簡介 */

? ? ? ? .summary {

? ? ? ? ? ? padding-right: 15px;

? ? ? ? ? ? padding-left: 15px;

? ? ? ? }

? ? ? ? .summary .col-md-4 {

? ? ? ? ? ? margin-bottom: 20px;

? ? ? ? ? ? text-align: center;

? ? ? ? }

? ? ? ? /* 特性 */

? ? ? ? .feature-divider {

? ? ? ? ? ? margin: 40px 0;

? ? ? ? }

? ? ? ? .feature {

? ? ? ? ? ? padding: 30px 0;

? ? ? ? }

? ? ? ? .feature-heading {

? ? ? ? ? ? font-size: 50px;

? ? ? ? ? ? color: #2a6496;

? ? ? ? }

? ? ? ? .feature-heading .text-muted {

? ? ? ? ? ? font-size: 28px;

? ? ? ? }

? ? ? ? /* 響應(yīng)式布局 */

? ? ? ? @media (max-width: 768px) {

? ? ? ? ? ? .summary {

? ? ? ? ? ? ? ? padding-right: 3px;

? ? ? ? ? ? ? ? padding-left: 3px;

? ? ? ? ? ? }

? ? ? ? ? ? .carousel {

? ? ? ? ? ? ? ? height: 300px;

? ? ? ? ? ? ? ? margin-bottom: 30px;

? ? ? ? ? ? }

? ? ? ? ? ? .carousel .item {

? ? ? ? ? ? ? ? height: 300px;

? ? ? ? ? ? }

? ? ? ? ? ? .carousel img {

? ? ? ? ? ? ? ? min-height: 300px;

? ? ? ? ? ? }

? ? ? ? ? ? .carousel-caption p {

? ? ? ? ? ? ? ? font-size: 16px;

? ? ? ? ? ? ? ? line-height: 1.4;

? ? ? ? ? ? }

? ? ? ? ? ? .feature-heading {

? ? ? ? ? ? ? ? font-size: 34px;

? ? ? ? ? ? }

? ? ? ? ? ? .feature-heading .text-muted {

? ? ? ? ? ? ? ? font-size: 22px;

? ? ? ? ? ? }

? ? ? ? }

? ? ? ? @media (min-width: 992px) {

? ? ? ? ? ? .feature-heading {

? ? ? ? ? ? ? ? margin-top: 120px;

? ? ? ? ? ? }

? ? ? ? }

? ? </style>

</head>

<body>

? ? <div>

? ? ? ? <div>

? ? ? ? ? ? <button type="button" data-toggle="collapse" data-target=".navbar-collapse">

? ? ? ? ? ? ? ? <span>切換導(dǎo)航</span>

? ? ? ? ? ? ? ? <span></span>

? ? ? ? ? ? </button>

? ? ? ? ? ? <a href="#">現(xiàn)代瀏覽器博物館</a>

? ? ? ? </div>

? ? ? ? <div class="navbar-collapse collapse">

? ? ? ? ? ? <ul class="nav navbar-nav">

? ? ? ? ? ? ? ? <li><a href="#ad-carousel">綜述</a></li>

? ? ? ? ? ? ? ? <li><a href="#summary-container">簡述</a></li>

? ? ? ? ? ? ? ? <li>

? ? ? ? ? ? ? ? ? ? <a href="#" data-toggle="dropdown">特點(diǎn) <span></span></a>

? ? ? ? ? ? ? ? ? ? <ul role="menu">

? ? ? ? ? ? ? ? ? ? ? ? <li><a href="#feature-tab" data-tab="tab-chrome">Chrome</a></li>

? ? ? ? ? ? ? ? ? ? ? ? <li><a href="#feature-tab" data-tab="tab-firefox">Firefox</a></li>

? ? ? ? ? ? ? ? ? ? ? ? <li><a href="#feature-tab" data-tab="tab-safari">Safari</a></li>

? ? ? ? ? ? ? ? ? ? ? ? <li><a href="#feature-tab" data-tab="tab-opera">Opera</a></li>

? ? ? ? ? ? ? ? ? ? ? ? <li><a href="#feature-tab" data-tab="tab-ie">IE</a></li>

? ? ? ? ? ? ? ? ? ? </ul>

? ? ? ? ? ? ? ? </li>

? ? ? ? ? ? ? ? <li><a href="#" data-toggle="modal" data-target="#about-modal">關(guān)于</a></li>

? ? ? ? ? ? </ul>

? ? ? ? </div>

? ? </div>

</div>

? ? <ol>

? ? ? ? <li data-target="#ad-carousel" data-slide-to="0"></li>

? ? ? ? <li data-target="#ad-carousel" data-slide-to="1"></li>

? ? ? ? <li data-target="#ad-carousel" data-slide-to="2"></li>

? ? ? ? <li data-target="#ad-carousel" data-slide-to="3"></li>

? ? ? ? <li data-target="#ad-carousel" data-slide-to="4"></li>

? ? </ol>

? ? <div>

? ? ? ? <div class="item active">

? ? ? ? ? ? <img src="images/chrome-big.jpg" alt="1 slide">

? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <h1>Chrome</h1>

? ? ? ? ? ? ? ? ? ? <p>Google Chrome，又稱Google瀏覽器，是一個由Google（谷歌）公司開發(fā)的網(wǎng)頁瀏覽器。</p>

? ? ? ? ? ? ? ? ? ? <p><a class="btn btn-lg btn-primary"

? ? ? ? ? ? ? ? ? ? ? ? ? role="button" target="_blank">點(diǎn)我下載</a></p>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? ? ? <div>

? ? ? ? ? ? <img src="images/firefox-big.jpg" alt="2 slide">

? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <h1>Firefox</h1>

? ? ? ? ? ? ? ? ? ? <p>Mozilla Firefox，中文名通常稱為“火狐”或“火狐瀏覽器”，是一個開源網(wǎng)頁瀏覽器。</p>

? ? ? ? ? ? ? ? ? ? <p><a class="btn btn-lg btn-primary" target="_blank"

? ? ? ? ? ? ? ? ? ? ? ? ? role="button">點(diǎn)我下載</a></p>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? ? ? <div>

? ? ? ? ? ? <img src="images/safari-big.jpg" alt="3 slide">

? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <h1>Safari</h1>

? ? ? ? ? ? ? ? ? ? <p>Safari，是蘋果計算機(jī)的最新操作系統(tǒng)Mac OS X中的瀏覽器。</p>

? ? ? ? ? ? ? ? ? ? <p><a class="btn btn-lg btn-primary" target="_blank"

? ? ? ? ? ? ? ? ? ? ? ? ? role="button">點(diǎn)我下載</a></p>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? ? ? <div>

? ? ? ? ? ? <img src="images/opera-big.jpg" alt="4 slide">

? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <h1>Opera</h1>

? ? ? ? ? ? ? ? ? ? <p>Opera瀏覽器，是一款挪威Opera Software ASA公司制作的支持多頁面標(biāo)簽式瀏覽的網(wǎng)絡(luò)瀏覽器。</p>

? ? ? ? ? ? ? ? ? ? <p><a class="btn btn-lg btn-primary" target="_blank"

? ? ? ? ? ? ? ? ? ? ? ? ? role="button">點(diǎn)我下載</a></p>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? ? ? <div>

? ? ? ? ? ? <img src="images/ie-big.jpg" alt="5 slide">

? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <h1>IE</h1>

? ? ? ? ? ? ? ? ? ? <p>Internet Explorer，簡稱 IE，是微軟公司推出的一款網(wǎng)頁瀏覽器。</p>

? ? ? ? ? ? ? ? ? ? <p><a class="btn btn-lg btn-primary" target="_blank"

? ? ? ? ? ? ? ? ? ? ? ? ? role="button">點(diǎn)我下載</a></p>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? </div>

? ? <a class="left carousel-control" href="#ad-carousel" data-slide="prev"><span

? ? ? ? ? ? class="glyphicon glyphicon-chevron-left"></span></a>

? ? <a class="right carousel-control" href="#ad-carousel" data-slide="next"><span

? ? ? ? ? ? class="glyphicon glyphicon-chevron-right"></span></a>

</div>

? ?

? ? <div class="modal fade" id="about-modal" tabindex="-1" role="dialog" aria-labelledby="modal-label"

? ? ? ? ?aria-hidden="true">

? ? ? ? <div>

? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <button type="button" data-dismiss="modal"><span

? ? ? ? ? ? ? ? ? ? ? ? ? ? aria-hidden="true">×</span><span>關(guān)閉</span></button>

? ? ? ? ? ? ? ? ? ? <h4 id="modal-label">關(guān)于</h4>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <p>慕課網(wǎng)隸屬于北京慕課科技中心(有限合伙)，是一家從事互聯(lián)網(wǎng)免費(fèi)教學(xué)的網(wǎng)絡(luò)教育公司。秉承“開拓、創(chuàng)新、公平、分享”的精神，

? ? ? ? ? ? ? ? ? ? ? ? 將互聯(lián)網(wǎng)特性全面的應(yīng)用在教育領(lǐng)域，致力于為教育機(jī)構(gòu)及求學(xué)者打造一站式互動在線教育品牌。</p>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? ? ? <div>

? ? ? ? ? ? ? ? ? ? <button type="button" class="btn btn-default" data-dismiss="modal">了解了</button>

? ? ? ? ? ? ? ? </div>

? ? ? ? ? ? </div>

? ? ? ? </div>

? ? </div>

? ? <footer>

? ? ? ? <p><a href="#top">回到頂部</a></p>

? ? </footer>

</div>

? ? $(function () {

? ? ? ? $('#ad-carousel').carousel();

? ? ? ? $('#menu-nav .navbar-collapse a').click(function (e) {

? ? ? ? ? ? var href = $(this).attr('href');

? ? ? ? ? ? var tabId = $(this).attr('data-tab');

? ? ? ? ? ? if ('#' !== href) {

? ? ? ? ? ? ? ? e.preventDefault();

? ? ? ? ? ? ? ? $(document).scrollTop($(href).offset().top - 70);

? ? ? ? ? ? ? ? if (tabId) {

? ? ? ? ? ? ? ? ? ? $('#feature-tab a[href=#' + tabId + ']').tab('show');

? ? ? ? ? ? ? ? }

? ? ? ? ? ? }

? ? ? ? });

? ? });

</script>

</body>

</html>

慕粉3462803

2016-08-09

源自：基于bootstrap的網(wǎng)頁開發(fā) 3-5

關(guān)注問題我要回答

908

操作

收起

1 回答

瑤海王力宏回答被采納 +3 積分
2016-08-10

你用百度的cdn試試

1 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

慕粉3462803 提問者

非常感謝！

2016-08-10 回復(fù) 有任何疑惑可以回復(fù)我~

舉報

0/150

提交

取消

基于bootstrap的網(wǎng)頁開發(fā)

參與學(xué)習(xí) 187653 人
解答問題 757 個

Bootstrap框架的基礎(chǔ)教程，學(xué)會用Bootstrap前端框架搭建網(wǎng)頁

進(jìn)入課程

本課相似問答

1 回答bootstrap框架不能在本地運(yùn)行嗎。

5 回答我在sublime里面編輯，我要引入一些class名字，為什么他不能像之前我看的視頻那樣，打上class后面就會自能提示很多class，然后選擇自己想要的，我要怎么實現(xiàn)class自動提示？

2 回答老師為什么我用的HBuilder按照你上面的代碼不能實現(xiàn)下拉菜單于標(biāo)簽頁對應(yīng)的跳轉(zhuǎn)！

1 回答我在bootstrap上怎么有些組件找不著呢？

5 回答初學(xué)bootstrap，有個問題就是，老師還是用的Dreamweaver嗎？不是很懂bootstrap是個什么東西？是軟件嗎？需要下載嗎

搜索更多本課相關(guān)問答

為什么老師的原代碼在我自己的Dreamweaver上運(yùn)行不了，就算把jquery,bootstrap的引用前面加上http://也不行

我要回答關(guān)注問題

使用 Ctrl+D 可將網(wǎng)站添加到書簽

微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

熱搜

最近搜索清空

為什么老師的原代碼在我自己的Dreamweaver上運(yùn)行不了，就算把jquery,bootstrap的引用前面加上http://也不行

1 回答

本課相似問答

為什么老師的原代碼在我自己的Dreamweaver上運(yùn)行不了，就算把jquery,bootstrap的引用前面加上http://也不行

為什么老師的原代碼在我自己的Dreamweaver上運(yùn)行不了，就算把jquery,bootstrap的引用前面加上http://也不行

為什么老師的原代碼在我自己的Dreamweaver上運(yùn)行不了，就算把jquery,bootstrap的引用前面加上http://也不行