html5網頁模板怎么修改，我們需要了解哪些？

　　html5網頁模板怎么修改，我們需要了解哪些?企業在為學校做html網頁模板時，有一個頁面要顯示一些考號、座號等，因為要經常修改，所以在后臺做一個可以定制的頁面。

　　所創建的組件分為兩類：文本組件(定制要顯示的文本，例如標題等)和數據組件(如座位號等，僅可修改寬度，內容不能直接編輯)。

　　闡述了編輯功能的基本實現;

　　一：布置。

　　其中，綠色p(.container)是每一個創建的組件中最外層的p，藍色span用于編輯文本，container中也有上面的工具條，以便將其向上偏移顯示在外部。最上面的紅色p(.move)是隱藏的，并向其添加了拖動事件。在右下方有一個正方形的p(.zoom)，它會在上面添加縮放事件。

　　二是編輯功能。

　　普通的編輯文本使用input，但是在上面使用input顯然不合適，在上面添加一個上contenteditable="true"屬性到span(或者上面的p)上面，就可以編輯它的內容了。

　　第三，拖拽。

　　因為所有的dom都在container中，所以只要在拖動時改變container的位置就可以了。

　　當組件接近頂部時，在基本拖動上加一個作用域限制，關于建站，以防止組件從頁面中被拖出，同時使工具條出現在下面。

　　四：比例調整。

　　(a)$container.find('.zoom').on('mousedown'),function(e){cancelBubble(e);var$element=$(this).parent();$(document).on('mousement)',function(e){varx=e.pageX-$element.offset().left();//pagex和offset所獲得的位置，是vary=e.pageY-$element.offset()(function);function(mousement);$element.css(height',y);returnfalse(function);function(function)(function){$element)}

　　這個部分實現了縮放的基本功能，并在后面限制了其最小寬度高度。cancelBubble是消除泡沫的功能。

　　取消冒泡函數functioncancelBubble(e)?(e.cancelBubble=true):(e.stoppropagation())

　　五、工具欄。

　　工具欄中的功能基本上都是處理文本，只需在相應的按鈕上添加功能即可，這里我使用的一個叫做jscolor的插件，還有一些blog中的顏色選擇器。

　　六：來源。

　　額，其它地方都是一些DOM和風格操作，這里就不多說了，放源碼吧。

　　以上就是關于html5網頁模板怎么修改的文字介紹，希望對您有幫助!