zTree 還原設計稿 樹結構樣式(1)

2021-09-25 18:09:48 字數 669 閱讀 8764

在使用ztree控制項時,不可避免的會要根據設計稿完成對控制項原有樣式的覆蓋;

下面是設計稿的樹樣式

這裡面的問題是後面節點背景條的實現;

下面看下ztree初始化的**:

這裡對li標籤下的ul標籤進行padding-left的設定,形成子節點的縮排;那我們的就不能只針對這裡的li標籤進行背景設定

解決:1.對原有樣式的覆蓋

.ztree li ul
2.通過自定義控制項的方式,對節點進行padding-left的設定

function adddiydom(treeid, treenode)
自定義控制項的使用,可參考ztree 單擊展開節點 新增自定義控制項

rem還原設計稿

使用閉包的方式把window物件傳入,獲取html物件,獲取html元素根物件,把750和100宣告乙個變數 orientationchange監聽手機移動裝置橫屏和豎屏事件 resize監聽瀏覽器大小變化事件 domcontentloaded是網頁載入完之後繫結的事件 事件分為捕獲和冒泡,第三個引...

rem適配還原設計稿,換算

假設設計妹妹給我們的設計稿尺寸為 750 1500 結合網易移動端首頁html元素上的動態font size屬性 設計稿尺寸 前端與設計之間協作流程一般分為下面兩種 1 網易做法 引入 頁面開頭出引入下面這段 用於動態計算font size 1 function doc,win 19 乘以100,p...

ZTREE 樹結構的使用教程

需求 根據不同級別的角色,將角色分在專案樹的結構的不同位置,並查詢後返回已選中的角色 例 實現步驟 2.新建實體類,用於接受返回值 包括擴父類id,是否開啟 具體每乙個字段使用,請參考 官方文件 public class treenode3.查詢返回主要使用的值,賦值給定義的treenode和pid...