最近做一個后台的管理項目,用到了Twitter推出的bootstrap前端開發工具包,是一個基於css3/html5的框架。花周末時間,寫了一個非常簡單后台的菜單。本着開源的精神,現在把它分享出來(呵呵,前端的老鳥就不要看啦!)。首先,看一下菜單的結構: 預覽地址 :http ...
最近做一個后台的管理項目,用到了Twitter推出的bootstrap前端開發工具包,是一個基於css html 的框架。花周末時間,寫了一個非常簡單后台的菜單。首先,看一下菜單的結構: 預覽地址:http: www.huosen.net demo bootstrap menu index.htmlcss的代碼為: ...
2014-10-24 16:12 0 9895 推薦指數:
最近做一個后台的管理項目,用到了Twitter推出的bootstrap前端開發工具包,是一個基於css3/html5的框架。花周末時間,寫了一個非常簡單后台的菜單。本着開源的精神,現在把它分享出來(呵呵,前端的老鳥就不要看啦!)。首先,看一下菜單的結構: 預覽地址 :http ...
本文使用的框架版本為: bootstrap3,Jquery2.1.0 (其他jquery可能會報錯,菜單項不執行 效果如下: 1.在項目中引入框架: <link rel="stylesheet" type="text/css" href="css ...
1、下拉菜單(基本用法) 在Bootstrap框架中的下拉菜單組件是一個獨立的組件,根據不同的版本,它對應的文件: ☑ LESS版本:對應的源碼文件為 dropdowns.less ☑ Sass版本:對應的源碼文件為 _dropdowns.scss ☑ 編譯后 ...
一、解釋 1、bootstrap提供的二級導航菜單只能實現點擊下拉框式的實現效果,不能實現鼠標移動顯示下拉框,也不能實現點擊一級導航的連接跳轉 2、現在實現 效果一:鼠標移動出現二級菜單 效果二:在有二級菜單的一級菜單下可以加鏈接,但是在手機的效果下屏蔽 ...
效果圖: 1.html+js部分: 2.css部分: ...
前端: <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv ...
<div class="tabbable"> <div class="nav nav-tabs"> <h2>個人中 ...
首先我們看下代碼:只需要簡單的將類名名A元素的collapsed給刪掉,將子類的collapse 后面加上in 就展開 ...