一種移動(dòng)端前端開發(fā)多屏適配方法
【專利摘要】本發(fā)明提供了一種移動(dòng)端前端開發(fā)多屏適配方法，具體包括以下步驟：步驟1：通過JavaScript獲取移動(dòng)端屏幕的設(shè)備像素縮放比值；步驟2：根據(jù)步驟1中獲得的設(shè)備像素縮放比值對(duì)應(yīng)調(diào)整頁(yè)面屬性；步驟3：加載不同尺寸的圖片，并生成視覺稿；步驟4：前端開發(fā)時(shí)通過Sass的函數(shù)和混合宏將視覺稿中彈性元素的單位進(jìn)行轉(zhuǎn)換，并生成最終效果圖。本發(fā)明將移動(dòng)端的頁(yè)面內(nèi)任何需要彈性適配的元素的尺寸均換算為rem進(jìn)行布局；當(dāng)頁(yè)面渲染時(shí)，根據(jù)頁(yè)面有效寬度進(jìn)行計(jì)算，并對(duì)應(yīng)調(diào)整rem的大小，動(dòng)態(tài)縮放以達(dá)到適配的效果，有效解決了因?yàn)轫?yè)面寬度固定，無法滿足大小屏展示效果的問題。
【專利說明】
一種移動(dòng)端前端開發(fā)多屏適配方法
技術(shù)領(lǐng)域
[0001]本發(fā)明涉及網(wǎng)頁(yè)設(shè)計(jì)技術(shù)領(lǐng)域，尤其涉及一種移動(dòng)端前端開發(fā)多屏適配方法。
【背景技術(shù)】
[0002]傳統(tǒng)的APP開發(fā)轉(zhuǎn)向移動(dòng)端Html5頁(yè)面開發(fā)，移動(dòng)端設(shè)備發(fā)展迅猛，面對(duì)不同分辨率的手機(jī)，面對(duì)不同屏幕尺寸的手機(jī)，很難有比較好的辦法來實(shí)現(xiàn)移動(dòng)端高清、多屏適配方案，傳統(tǒng)開發(fā)有如下幾種方法:1.固定頁(yè)面寬度，禁止縮放，這種方案頁(yè)面寬度固定，頁(yè)面單一，無法滿足多屏效果。2.固定高度，寬度自適應(yīng)，以較小寬度的視覺稿作為參照布局，當(dāng)屏幕變化時(shí)，拉伸或填充空白來補(bǔ)充容器。3.視覺稿、頁(yè)面寬度使用統(tǒng)一寬度，利用瀏覽器自身縮放來完成適配。傳統(tǒng)開發(fā)中存在很多問題，因此開發(fā)一種頁(yè)面自適應(yīng)的解決方案迫在眉睫，如申請(qǐng)?zhí)枮?201310608370.9的中國(guó)專利公開了一種頁(yè)面布局自適應(yīng)方法及裝置，該發(fā)明實(shí)施例插入用于調(diào)整頁(yè)面布局的程序代碼;基于插入的所述程序代碼，獲取移動(dòng)終端的屏幕顯示寬度;根據(jù)獲取的屏幕顯示寬度，按照預(yù)設(shè)比例調(diào)整網(wǎng)頁(yè)的頁(yè)面顯示寬度;根據(jù)所述頁(yè)面顯示寬度，調(diào)整組成網(wǎng)頁(yè)頁(yè)面的各元素的顯示寬度，同時(shí)設(shè)置所述元素的顯示位置為浮動(dòng)顯示，還提供了一種頁(yè)面布局自適應(yīng)裝置，包括:代碼插入模塊，用于插入用于調(diào)整頁(yè)面布局的程序代碼;參數(shù)獲取模塊，用于基于插入的所述程序代碼，獲取移動(dòng)終端的屏幕顯示寬度;布局調(diào)整模塊，用于根據(jù)獲取的屏幕顯示寬度，按照預(yù)設(shè)比例調(diào)整網(wǎng)頁(yè)的頁(yè)面顯示寬度;根據(jù)所述頁(yè)面顯示寬度，調(diào)整組成網(wǎng)頁(yè)頁(yè)面的各元素的顯示寬度，同時(shí)設(shè)置所述元素的顯示位置為浮動(dòng)顯示。該發(fā)明通過程序代碼與預(yù)設(shè)比例來調(diào)整網(wǎng)頁(yè)的頁(yè)面寬度，可以達(dá)到一定的適配效果，但是不適用于所有的屏幕寬度，僅適用于預(yù)設(shè)比例的寬度，并且沒有考慮到網(wǎng)頁(yè)轉(zhuǎn)換時(shí)像素的問題，在實(shí)際使用的過程中仍存在較大的局限性。
[0003]又如申請(qǐng)?zhí)?201510679492.6的中國(guó)專利提供一種面向多終端的自適應(yīng)網(wǎng)頁(yè)布局方法，包括如下步驟:步驟10、創(chuàng)建和編輯頁(yè)面布局的CSS，給CSS預(yù)設(shè)切換節(jié)點(diǎn)；步驟20、設(shè)置頁(yè)面的樣式布局架構(gòu)，將圖標(biāo)和標(biāo)題嵌套進(jìn)各自對(duì)應(yīng)的功能模塊內(nèi)；步驟30、編寫節(jié)點(diǎn)切換的JavaScript腳本，對(duì)終端屏幕的分辨率進(jìn)行判斷并根據(jù)不同分辨率自動(dòng)為網(wǎng)頁(yè)最外層的全局對(duì)象切換相應(yīng)樣式的節(jié)點(diǎn)，呈現(xiàn)出對(duì)應(yīng)的頁(yè)面布局。還提供了一種面向多終端的自適應(yīng)網(wǎng)頁(yè)布局裝置，包括預(yù)設(shè)模塊、布局模塊和切換模塊:所述預(yù)設(shè)模塊:用于創(chuàng)建和編輯頁(yè)面布局的CSS，給CSS預(yù)設(shè)切換節(jié)點(diǎn)；所述布局模塊:用于設(shè)置頁(yè)面的樣式布局架構(gòu)，并將圖標(biāo)和標(biāo)題嵌套進(jìn)各自對(duì)應(yīng)的功能模塊內(nèi)；所述切換模塊:用于編寫節(jié)點(diǎn)切換的JavaScript腳本，對(duì)終端屏幕的分辨率進(jìn)行判斷并根據(jù)不同分辨率自動(dòng)為網(wǎng)頁(yè)最外層的全局對(duì)象切換相應(yīng)樣式的節(jié)點(diǎn)，呈現(xiàn)出對(duì)應(yīng)的頁(yè)面布局。該發(fā)明通過判斷終端屏幕的分辨率自動(dòng)切換樣式節(jié)點(diǎn)，需要提前預(yù)設(shè)多種樣式，方法繁瑣，并且沒有考慮到普通屏與高清屏中設(shè)備像素縮放比等的差別，自適應(yīng)頁(yè)面的效果不佳。

【發(fā)明內(nèi)容】

[0004]為克服現(xiàn)有技術(shù)中存在的無法兼容多屏設(shè)備，做不到頁(yè)面統(tǒng)一且在高清屏下圖片模糊，無法解決像素邊框的問題，本發(fā)明提供了一種移動(dòng)端前端開發(fā)多屏適配方法，其具體技術(shù)方案如下:
[0005]—種移動(dòng)端前端開發(fā)多屏適配方法，包括以下步驟:
[000?]步驟1:通過JavaScript獲取移動(dòng)端屏幕的設(shè)備像素縮放比值；
[0007]步驟2:根據(jù)步驟I中獲得的設(shè)備像素縮放比值對(duì)應(yīng)調(diào)整頁(yè)面屬性；
[0008]步驟3:加載不同尺寸的圖片，并生成視覺稿；
[0009]步驟4:前端開發(fā)時(shí)將視覺稿中的彈性元素的單位進(jìn)行轉(zhuǎn)換，并生成最終效果圖。
[0010]在此基礎(chǔ)上，所述步驟2中進(jìn)一步包括:根據(jù)步驟I中獲得的設(shè)備像素縮放比值計(jì)算出HTML的基準(zhǔn)值，進(jìn)而相應(yīng)的進(jìn)行頁(yè)面屬性的調(diào)整。
[0011]在此基礎(chǔ)上，所述HTML的基準(zhǔn)值=屏幕寬度*設(shè)備像素縮放比值/16。
[0012]在此基礎(chǔ)上，所述HTML的基準(zhǔn)值與動(dòng)態(tài)設(shè)備像素縮放比值——對(duì)應(yīng)，并均寫入HTML0
[0013]在此基礎(chǔ)上，所述步驟2中還進(jìn)一步包括:根據(jù)步驟I獲得的設(shè)備像素縮放比值動(dòng)態(tài)設(shè)置頁(yè)面的viewport，進(jìn)而相應(yīng)的進(jìn)行頁(yè)面屬性的調(diào)整。
[0014]在此基礎(chǔ)上，所述viewport根據(jù)不同的設(shè)備像素比值設(shè)置有不同的scale值。
[0015]在此基礎(chǔ)上，所述scale值=I/設(shè)備像素縮放比值。
[0016]在此基礎(chǔ)上，所述步驟4的具體步驟為通過Sass的函數(shù)和混合宏將視覺稿中彈性元素的單位進(jìn)行轉(zhuǎn)換。
[0017]在此基礎(chǔ)上，所述視覺稿中彈性元素的單位為像素單位。
[0018]在此基礎(chǔ)上，所述步驟4中將像素單位轉(zhuǎn)換為rem。
[0019]與現(xiàn)有技術(shù)相比，本發(fā)明的有益效果是:
[0020]1、本發(fā)明通過JavaScript獲取移動(dòng)端屏幕的設(shè)備像素縮放比值;并根據(jù)獲得的設(shè)備像素縮放比值對(duì)應(yīng)調(diào)整頁(yè)面屬性;加載不同尺寸的圖片，并生成視覺稿;前端開發(fā)時(shí)將視覺稿中的彈性元素的單位進(jìn)行轉(zhuǎn)換，并生成最終效果圖。本發(fā)明可以根據(jù)移動(dòng)端屏幕動(dòng)態(tài)縮放頁(yè)面，能夠滿足大小屏的展示效果，也給設(shè)計(jì)帶來無限的可能性。
[0021]2、本發(fā)明中通過Sass的函數(shù)和混合宏將視覺稿中彈性元素的單位進(jìn)行轉(zhuǎn)換，該視覺稿中的彈性元素的尺寸均換算為rem進(jìn)行布局，當(dāng)頁(yè)面渲染時(shí)，根據(jù)頁(yè)面有效寬度進(jìn)行計(jì)算，調(diào)整rem的大小，動(dòng)態(tài)縮放以達(dá)到適配的效果，該頁(yè)面可以完美兼容多屏設(shè)備，并做到頁(yè)面的一致性。
[0022]3、本發(fā)明中根據(jù)設(shè)備像素縮放比來計(jì)算HTML的基準(zhǔn)值和頁(yè)面viewport中的scale值，其中HTML的基準(zhǔn)值=屏幕寬度*設(shè)備像素縮放比值/16 ,scale值=I/設(shè)備像素縮放比值，本發(fā)明可以解決圖片在普通屏和高清屏(retina)切換時(shí)，像素邊框和圖片模糊的問題。
[0023]4、本發(fā)明在進(jìn)行頁(yè)面渲染時(shí)，根據(jù)頁(yè)面有效寬度計(jì)算來調(diào)整rem的大小，通過動(dòng)態(tài)縮放以到達(dá)適配的效果，無需運(yùn)用媒體差選來動(dòng)態(tài)改變r(jià)em基數(shù)，可以兼容到所有設(shè)備的各種尺寸，因此可以節(jié)約更多的時(shí)間并提供更好的用戶體驗(yàn)。
【附圖說明】
[0024]圖1是本發(fā)明一種移動(dòng)端前端開發(fā)多屏適配方法的流程示意圖。
【具體實(shí)施方式】
[0025]以下結(jié)合附圖和實(shí)施例，對(duì)本發(fā)明進(jìn)行進(jìn)一步詳細(xì)說明。應(yīng)當(dāng)理解，此處所描述的具體實(shí)施例僅用以解釋本發(fā)明，并不用于限定本發(fā)明。
[0026]本發(fā)明披露了一種移動(dòng)端前端開發(fā)多屏適配方法，如圖1所示為該方法的流程示意圖。本方法包括以下步驟:
[0027]步驟1:通過JavaScript獲取移動(dòng)端屏幕的設(shè)備像素縮放比值；
[0028]步驟2:根據(jù)步驟I中獲得的設(shè)備像素縮放比值對(duì)應(yīng)調(diào)整頁(yè)面屬性；
[0029]步驟3:加載不同尺寸的圖片，并生成視覺稿；
[0030]步驟4:前端開發(fā)時(shí)將視覺稿中的彈性元素的單位進(jìn)行轉(zhuǎn)換，并生成最終效果圖。[0031 ] 具體的步驟1:通過JavaScript的window.devicePixelRat1來獲取移動(dòng)端屏幕的設(shè)備像素縮放比值;在JavaScript文件中根據(jù)window.devicePixelRat1S卩可獲得屏幕的設(shè)備像素縮放比(dpr) ,window.devicePixeIRat1是設(shè)備上物理像素和設(shè)備獨(dú)立像素(device-1ndependent pixels(dips))的比例。公式表不為window.devicePixelRat1 =物理像素/dips。
[0032]具體的步驟2:根據(jù)步驟I中獲得的設(shè)備像素縮放比值對(duì)應(yīng)調(diào)整頁(yè)面屬性，該頁(yè)面屬性包括HTML的基準(zhǔn)值和頁(yè)面的viewport。因此步驟2中進(jìn)一步包括:根據(jù)步驟I中獲得的設(shè)備像素縮放比值計(jì)算出HTML的基準(zhǔn)值，進(jìn)而相應(yīng)的進(jìn)行頁(yè)面屬性的調(diào)整。優(yōu)選的，所述HTML的基準(zhǔn)值=屏幕寬度*設(shè)備像素縮放比值/16，優(yōu)選地，根據(jù)JavaScript文件中的document.documentElement.cl ientWidth獲取屏幕寬度，基于不同的設(shè)備，設(shè)備像素縮放比不斷變化，根據(jù)步驟I獲得的相應(yīng)的設(shè)備像素縮放比，進(jìn)而計(jì)算得出的HTML的基準(zhǔn)值，該HTML的基準(zhǔn)值與動(dòng)態(tài)設(shè)備像素縮放比值一一對(duì)應(yīng)，并將所有計(jì)算得出的HTML均寫入HTML中保存。步驟2中還進(jìn)一步包括:根據(jù)步驟I獲得的設(shè)備像素縮放比值動(dòng)態(tài)設(shè)置頁(yè)面的viewport，即設(shè)備的屏幕上用來顯示網(wǎng)頁(yè)的區(qū)域，進(jìn)而相應(yīng)的進(jìn)行頁(yè)面屬性的調(diào)整。viewport根據(jù)不同的設(shè)備像素比值設(shè)置有不同的scale值，優(yōu)選的，scale值=1/設(shè)備像素縮放比值，其中scale的值隨著dpr變化可以解決I像素邊框的問題。根據(jù)設(shè)備像素縮放比動(dòng)態(tài)設(shè)置頁(yè)面的viewport，進(jìn)行縮放頁(yè)面，以達(dá)到高清的效果。
[0033]例如:當(dāng)dpr= I Jt^fviewport設(shè)置為:
[0034]initial_scale = l ,max imum-s ca I e = I ,minimum-scale = I ；
[0035]當(dāng)dpr = 2;此時(shí)viewport 設(shè)置為:
[0036]initial-scale = 0.5 ,maximum-scale = 0.5 ,minimum-scale = 0.5 ；
[0037]當(dāng)dpr = 3;此時(shí)viewport 設(shè)置為:
[0038]initial-scale = 0.3333333333333333,maximum-scale = 0.3333333333333333，
[0039]minimum-scale = 0.3333333333333333 ；
[0040]其中dpr即為設(shè)備像素縮放比。如當(dāng)dpr為2的情況下，設(shè)置頁(yè)面的scale值為0.5，這樣就能實(shí)現(xiàn)I像素的邊框。該I像素邊框是指物理I像素的邊框，在高分屏下的I像素是dpr*l像素的大小，通過viewport中的scale來縮放成物理I像素大小。I像素邊框是指物理I像素的邊框，在高分屏下的I像素是dpr* I像素的大小，通過，viewport中的scale來縮放成物理I像素大小。本發(fā)明可以解決圖片在普通屏和高清屏(retina)切換時(shí)，像素邊框和圖片模糊的問題。
[0041]具體的步驟3:加載不同尺寸的圖片，并生成視覺稿;例如:當(dāng)dpr為I的時(shí)候加載跟屏幕像素相同比例的圖片；當(dāng)dpr為2是，加載屏幕尺寸兩倍的圖片。根據(jù)dpr的不同加載不同的圖片，優(yōu)選地，根據(jù)C s s中的background-s i z e來改變圖片的大小。優(yōu)選地，本發(fā)明步驟3中還包括自動(dòng)校正，通過尋找垂直和水平線條，根據(jù)線條的傾斜角度校正圖片。首先通過邊緣搜索算法對(duì)圖像預(yù)處理強(qiáng)調(diào)圖像邊界，然后將圖像進(jìn)行變換，優(yōu)選地，使用HoughTransform對(duì)圖片進(jìn)行變換，并其最終將圖片中各個(gè)相鄰像白色素連成的線段的角度和該線段離圖像中心的距離標(biāo)出，優(yōu)選地，橫軸是角度，縱軸是線段離中心距離，顏色越亮表示這樣的線段越多。邊緣圖的一個(gè)點(diǎn)，對(duì)應(yīng)著Hough參數(shù)空間中的一條正弦曲線，邊緣圖中的一條直線對(duì)應(yīng)著參數(shù)空間的一個(gè)點(diǎn)，即點(diǎn)坐標(biāo)到極坐標(biāo)，而非直線坐標(biāo)到極坐標(biāo)。邊緣圖中所有點(diǎn)在參數(shù)空間畫出的曲線在參數(shù)空間中能在某幾個(gè)點(diǎn)處相交，這幾個(gè)點(diǎn)即對(duì)應(yīng)著邊緣圖中的直線，把上述的峰值點(diǎn)代表的線段放回原圖像驗(yàn)證，可以得到多組有效線段，根據(jù)前一步找到的線段角度，就可以對(duì)圖像進(jìn)行有效的校正。
[0042]具體的步驟4:前端開發(fā)時(shí)將視覺稿中的彈性元素的單位進(jìn)行轉(zhuǎn)換，并生成最終效果圖。優(yōu)選的，步驟4的具體步驟為通過Sass的函數(shù)和混合宏將視覺稿中彈性元素的單位進(jìn)行轉(zhuǎn)換，步驟3中視覺稿中彈性元素的單位為像素單位(PX)。優(yōu)選的，步驟4中將所有彈性元素的單位如像素均轉(zhuǎn)換為rem，其中px像素(Pixel)為相對(duì)長(zhǎng)度單位，像素px是相對(duì)于顯示器屏幕分辨率而言的，比較穩(wěn)定和精確，但在瀏覽器中放大或縮放瀏覽頁(yè)面時(shí)會(huì)出現(xiàn)頁(yè)面混亂的情況。Rem也是一個(gè)相對(duì)單位(root em，根em)，是相對(duì)HTML根元素。優(yōu)選的，Sass的函數(shù)和混合宏將視覺稿中彈性元素的單位進(jìn)行轉(zhuǎn)換的具體步驟為:通過計(jì)算公式rem =視覺稿的px值/rem基數(shù)將視覺稿中彈性元素的單位進(jìn)行轉(zhuǎn)換。將該視覺稿中的彈性元素的尺寸均換算為rem進(jìn)行布局，當(dāng)頁(yè)面渲染時(shí)，根據(jù)頁(yè)面有效寬度進(jìn)行計(jì)算，調(diào)整rem的大小，動(dòng)態(tài)縮放以達(dá)到適配的效果，無需運(yùn)用媒體差選來動(dòng)態(tài)改變r(jià)em基數(shù)，可以兼容到所有設(shè)備的各種尺寸，因此可以節(jié)約更多的時(shí)間并提供更好的用戶體驗(yàn)。該頁(yè)面可以完美兼容多屏設(shè)備，并做到頁(yè)面的一致性。
[0043]本發(fā)明通過JavaScript獲取移動(dòng)端屏幕的設(shè)備像素縮放比值;并根據(jù)獲得的設(shè)備像素縮放比值對(duì)應(yīng)調(diào)整頁(yè)面屬性;加載不同尺寸的圖片，并生成視覺稿;前端開發(fā)時(shí)將視覺稿中的彈性元素的單位進(jìn)行轉(zhuǎn)換，并生成最終效果圖。本發(fā)明可以根據(jù)移動(dòng)端屏幕動(dòng)態(tài)縮放頁(yè)面，能夠滿足大小屏的展示效果，也給設(shè)計(jì)帶來無限的可能性。本發(fā)明在進(jìn)行頁(yè)面渲染時(shí)，根據(jù)頁(yè)面有效寬度計(jì)算來調(diào)整rem的大小，通過動(dòng)態(tài)縮放以到達(dá)適配的效果，無需運(yùn)用媒體差選來動(dòng)態(tài)改變r(jià)em基數(shù)，可以兼容到所有設(shè)備的各種尺寸，因此可以節(jié)約更多的時(shí)間并提供更好的用戶體驗(yàn)。
[0044]上述說明示出并描述了本發(fā)明的優(yōu)選實(shí)施例，如前所述，應(yīng)當(dāng)理解本發(fā)明并非局限于本文所披露的形式，不應(yīng)看作是對(duì)其他實(shí)施例的排除，而可用于各種其他組合、修改和環(huán)境，并能夠在本文所述發(fā)明構(gòu)想范圍內(nèi)，通過上述教導(dǎo)或相關(guān)領(lǐng)域的技術(shù)或知識(shí)進(jìn)行改動(dòng)。而本領(lǐng)域人員所進(jìn)行的改動(dòng)和變化不脫離本發(fā)明的精神和范圍，則都應(yīng)在本發(fā)明所附權(quán)利要求的保護(hù)范圍內(nèi)。
【主權(quán)項(xiàng)】
1.一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:包括以下步驟: 步驟1:通過JavaScript獲取移動(dòng)端屏幕的設(shè)備像素縮放比值； 步驟2:根據(jù)步驟I中獲得的設(shè)備像素縮放比值對(duì)應(yīng)調(diào)整頁(yè)面屬性； 步驟3:加載不同尺寸的圖片，并生成視覺稿； 步驟4:前端開發(fā)時(shí)將視覺稿中的彈性元素的單位進(jìn)行轉(zhuǎn)換，并生成最終效果圖。2.根據(jù)權(quán)利要求1所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述步驟2中進(jìn)一步包括:根據(jù)步驟I中獲得的設(shè)備像素縮放比值計(jì)算出HTML的基準(zhǔn)值，進(jìn)而相應(yīng)的進(jìn)行頁(yè)面屬性的調(diào)整。3.根據(jù)權(quán)利要求2所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述HTML的基準(zhǔn)值=屏幕寬度*設(shè)備像素縮放比值/16。4.根據(jù)權(quán)利要求3所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述HTML的基準(zhǔn)值與動(dòng)態(tài)設(shè)備像素縮放比值一一對(duì)應(yīng)，并均寫入HTML。5.根據(jù)權(quán)利要求1所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述步驟2中還進(jìn)一步包括:根據(jù)步驟I獲得的設(shè)備像素縮放比值動(dòng)態(tài)設(shè)置頁(yè)面的viewport，進(jìn)而相應(yīng)的進(jìn)行頁(yè)面屬性的調(diào)整。6.根據(jù)權(quán)利要求5所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述V i ewpor t根據(jù)不同的設(shè)備像素比值設(shè)置有不同的s ca I e值。7.根據(jù)權(quán)利要求6所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述scale值=I/設(shè)備像素縮放比值。8.根據(jù)權(quán)利要求1所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述步驟4的具體步驟為通過Sass的函數(shù)和混合宏將視覺稿中彈性元素的單位進(jìn)行轉(zhuǎn)換。9.根據(jù)權(quán)利要求8所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述視覺稿中彈性元素的單位為像素單位。10.根據(jù)權(quán)利要求8所述的一種移動(dòng)端前端開發(fā)多屏適配方法，其特征在于:所述步驟4中將像素單位轉(zhuǎn)換為rem。
【文檔編號(hào)】G06F17/30GK105912336SQ201610222577
【公開日】2016年8月31日
【申請(qǐng)日】2016年4月11日
【發(fā)明人】何中, 鞠海林, 戴建峰, 嚴(yán)偉, 顧永新, 張龍, 徐曉輝
【申請(qǐng)人】江蘇中威科技軟件系統(tǒng)有限公司