怎么安裝Split

這篇文章主要講解了“怎么安裝Split”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“怎么安裝Split”吧！

　　Split.js是一款可調節大小的拆分視圖面板純JavaScript插件。該插件的特點是輕量級，無需任何外部依賴。Split.js可以輕松的制作出拆分視圖（或分割面板）效果。

　　Split.js安裝

　　可以使用bower或npm來安裝Split.js插件。

　　bowerinstallSplit.js

　　npminstallsplit.js

　　使用方法

　　使用該插件需要引入split.js文件。

　　<scriptsrc="js/split.js"charset="utf-8"></script>

　　HTML結構

　　split.js使用嵌套<div>的HTML結構

　　<divclass="example">

　　<divid="one"class="splitsplit-horizontal">

　　<p>......</p>

　　</div>

　　<divid="two"class="splitsplit-horizontal">

　　<p>......</p>

　　</div>

　　</div>

　　split.js插件所必須的一些CSS樣式

　　.gutter{

　　background-color:#eee;

　　background-repeat:no-repeat;

　　background-position:50%;

　　cursor:move;

　　cursor:grab;

　　cursor:-moz-grab;

　　cursor:-webkit-grab;

　　}

　　.gutter.gutter-horizontal{

　　background-image:url('grips/vertical.png');

　　}

　　.gutter.gutter-vertical{

　　background-image:url('grips/horizontal.png');

　　}

　　.split{

　　-webkit-box-sizing:border-box;

　　-moz-box-sizing:border-box;

　　box-sizing:border-box;

　　overflow-y:auto;

　　overflow-x:hidden;

　　}

　　.split,.gutter.gutter-horizontal{

　　height:100%;

　　float:left;

　　}

感謝各位的閱讀，以上就是“怎么安裝Split”的內容了，經過本文的學習后，相信大家對怎么安裝Split這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！