簡單側邊欄案例-隱藏右邊盒子滑鼠經過時顯示
最近剛開始入門學習前端用簡單的html結構加css樣式寫了個側邊欄的小案例在這裡分享給大家。
效果如下:
該案例主要是在乙個sidebar盒子裡面左邊放乙個ul做側邊欄裡面的li作為每一行的內容，然後將sidebar-mask盒子定位到側邊欄的右邊，用display:none將該盒子先隱藏起來，然後經過也就是hover該盒子的時候就display:block，然後就是對側邊欄每一行的li經過做了乙個過渡效果padding值會撐開。
**如下（示例）：
*
.sidebar
.sidebar ul
.sidebar ul li
.sidebar ul li p
.sidebar ul li span
.sidebar ul li:hover
.sidebar ul li:hover .sidebar-mask
.sidebar-mask
剛學習前端沒多久，想將每天學到的小案例分享給大家，寫的不好的地方還望大家多多指教。
側邊欄廣告
1 23192031 323334 天王蓋地虎，小雞燉蘑菇 35天王蓋地虎，小雞燉蘑菇 36天王蓋地虎，小雞燉蘑菇 37天王蓋地虎，小雞燉蘑菇 38天王蓋地虎，小雞燉蘑菇 39天王蓋地虎，小雞燉蘑菇 40天王蓋地虎，小雞燉蘑菇 41天王蓋地虎，小雞燉蘑菇 42天王蓋地虎，小雞燉蘑菇 43天王蓋地虎，...
部落格側邊欄
感謝 頁面定製css 以下為隱藏反對 buryit ad t2,cnblogs c1,under post news,cnblogs c2,under post kb dataintable td phrase 部落格側邊欄公告 支援html 支援js bamboo lamp 一藝之成，當盡畢生之力...
天貓側邊欄
本markdown編輯器使用stackedit修改而來，用它寫部落格，將會帶來全新的體驗哦 markdown 是一種輕量級標記語言，它允許人們使用易讀易寫的純文字格式編寫文件，然後轉換成格式豐富的html頁面。維基百科 使用簡單的符號標識不同的標題，將某些文字標記為粗體或者斜體，建立乙個鏈結等，詳細...