久久久精品一区ed2k-女人被男人叉到高潮的视频-中文字幕乱码一区久久麻豆樱花-俄罗斯熟妇真实视频

bootstrap第二天

1.導(dǎo)航元素,導(dǎo)航欄

創(chuàng)新互聯(lián)建站主要從事成都網(wǎng)站建設(shè)、做網(wǎng)站、網(wǎng)頁設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)臨泉,十載網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):18982081108

    模擬淘寶網(wǎng)的導(dǎo)航

    bootstrap 第二天

    

<!DOCTYPE html>

<html>

<head>

   <title>Bootstrap 實(shí)例 - 嵌套列</title>

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

   <script src="./scripts/jquery.min.js"></script>

<script src="./scripts/jquery2.min.js"></script>

   <script src="./bootstrap/js/bootstrap.min.js"></script>

</head>

<body>

   <div class="nb">

                //導(dǎo)航元素

<ul class="nav nav-tabs" role="nav">

<li class="active"><a href="#">寶貝</a></li>

<li><a href="#">天貓</a></li>

<li><a href="#">店鋪</a></li>

</ul>

 //表單,輸入與搜索按鈕

<div role="form"  >

<form role="form">

<div class="input-group">

<input type="text" class="form-control"></input>

<span class="input-group-btn">

<button class="btn "  type="button">

搜索

</button>

</span>

</div>

</form>

</div>

   </div>

<script>

                //jquery控制css變化

function changeBorder(event,color){

$(event.target).closest("li").attr("class","active").css("border","solid" + color)

$("input").css("border","solid" + color);

$("input").css("border-bottom","6px solid" + color);

$("span button").css("border","solid" + color);

}

$("ul").bind("click",function(event){

//取消所有l(wèi)i的active類名

$("ul li").each(function(){

this.className = "";

$(this).css("border","");

$("input").css("border","");

});

//增加class類

if(($(event.target).html() == "寶貝") || ($(event.target).html() == "店鋪")){

changeBorder(event,"#ff5400");

}

if($(event.target).html() == "天貓"){

changeBorder(event,"#c60000");

}

});

</script>

</body>

</html>


2.下拉菜單,dropdown

bootstrap 第二天

<!--////按鈕組,可使按鈕緊密排列-->

<!-- 按鈕組樣式   btn-toolbar,group,group-lg,vertical >

<div class="btn-group">

<!--////btn-primary 藍(lán)色-->

<button type="button" class="btn btn-primary">Button1</button>

<!--////btn-default 灰色-->

    <button type="button" class="btn btn-default">Button2</button>

<!--////dropdown-toggle 一個(gè)為下拉設(shè)計(jì)的樣式-->

<button type="button" class="btn btn-default dropdown-toggle">

<!--////data-toggle(該按鈕上加載下拉菜單動作)與dropdown-menu要在同一級,菜單出現(xiàn)在該級的最左邊-->

<a href="#"  data-toggle="dropdown" class="glyphicon glyphicon-align-justify"></a>

<!--////菜單中的內(nèi)容,只有點(diǎn)擊下拉菜單時(shí)才出現(xiàn)-->

<ul class="dropdown-menu">

<!--//下拉菜單的標(biāo)題-->

<li class="dropdown-header">應(yīng)用</li>

<li>

<!--//glyphicon glyphicon-camera 字形圖(像圖片一樣的字-_-)-->

<!--   <span class= "caret"/> 下三角 -->

<a href="#" class="glyphicon glyphicon-camera"></a>

</li>

<li>

<a href="#" class="glyphicon glyphicon-cloud"></a>

</li>

<li>

<a href="#" class="glyphicon glyphicon-music"></a>

</li>

<!--下拉菜單的分隔欄-->

<li class="divider"></li>

<li>

<a href="#">others</a>

</li>

 </ul>

</button>

</div>

3.<pre>與<code>

瀏覽器行為:

因?yàn)闉g覽其讀入html文件時(shí),里面的內(nèi)容不會保留回車,空格最多保留一個(gè),如果一行顯示不下(width不夠),會從第二行開始,不會把一個(gè)單詞分開2行。

<pre>: 保留空格和換行符

<code>:語義,提醒此標(biāo)簽內(nèi)是程序。

bootstrap 第二天

所以,如果一行為word1,word2,其中word2長,一行放不下,那么word-break:break-all會讓第一行是word1,word2(part1),第二行是word2(part2)。而word-wrap:break-word,第一行是word1,第二行是word2(part1),第三行是word3(part2)。

4.<address><blockquote>排版

    作用對象:一段話

5.列表的排版 

 class="list-inline"  dl-horizontal

     作用對象:ul ol

6.導(dǎo)航元素屬性:

.nav .nav-tabs .active .nav-pill .nav-stacked .nav-justified 

.disabled

導(dǎo)航欄:navbar 固定位置 導(dǎo)航中的表單,按鈕,字體樣式

7.JQUERY對象與DOM對象

    JQUERY:$("div") 沒有DOM對象的方法

    DOM對象沒有JQUERY的方法

    可是:JQUERY中的each方法中的this是DOM對象啊

    JQUERY -> DOM

    jqueryObject.get(0)   jqueryObject[0]

    DOM -> JQUERY

    $(domObject)

網(wǎng)站名稱:bootstrap第二天
分享地址:http://sd-ha.com/article16/ihhedg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供面包屑導(dǎo)航、網(wǎng)站建設(shè)、定制網(wǎng)站微信公眾號、搜索引擎優(yōu)化、企業(yè)建站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)公司