-
Bootstrap框架移動(dòng)優(yōu)先的前端框架,寫非常少的代碼即可實(shí)現(xiàn)多終端的頁面適配 ie9以下需引入respond.min.js查看全部
-
內(nèi)嵌式寫法: <style>@media screen and (min-width:480px){body{background:blue;}}</style> 當(dāng)屏幕分辨率小于480px 在link中引進(jìn)來 media="only screen and (max-width:480px)"查看全部
-
css3-Media query 常見屬性: ·device-width,devide-height:屏幕的寬高 ·width,height:渲染窗口寬高 ·orientation:設(shè)備方向 ·resolution:設(shè)備分辨率查看全部
-
1、nav 2、List group 3、jumbotron 4、柵格布局:container row .col-sm- 注意:bootstrap高度組件化,不要做過多的重新開發(fā);掌握柵格布局。查看全部
-
柵格系統(tǒng)條件: 父元素 container .col-xs-(垂直布局 auto) .col-sm- 60px .col-md- 78px .col-lg- 95px; 組件:導(dǎo)航、下拉框查看全部
-
css3-Media query 常見屬性 device-width device-height : width height: orientation:方向 resolution:分辨率 內(nèi)嵌式寫法:<style>@media screen and (min-width:480px){body{background:blue;}}</style> 當(dāng)屏幕分辨率小于480px才在link中引進(jìn)來 media="only screen and (max-width:480px)"查看全部
-
CSS3-Media Query 借助原生Javascript 第三方的響應(yīng)式布局框架查看全部
-
響應(yīng)式設(shè)計(jì)的原則查看全部
-
響應(yīng)式設(shè)計(jì)的優(yōu)缺點(diǎn)。查看全部
-
bootstrap響應(yīng)式布局的框架。查看全部
-
實(shí)現(xiàn)響應(yīng)式布局: CSS3-Media Query(最簡單方式) (推薦:能滿足大部分的需求) 借助原生JavaScript(不推薦) 第三方開源框架(比如:bootstrap)查看全部
-
響應(yīng)式設(shè)計(jì)的原則 移動(dòng)優(yōu)先:在設(shè)計(jì)的初期就要考慮頁面如何在多終端展示 漸進(jìn)增強(qiáng):充分發(fā)揮硬件設(shè)備的最大功能查看全部
-
優(yōu)點(diǎn): 解決了設(shè)備之間的差異化展示,讓不同的設(shè)備達(dá)到最優(yōu)的視覺體驗(yàn). 缺點(diǎn): 1/兼容性代碼多,工作量大,加載速度受影響, 2/對(duì)原有網(wǎng)站布局會(huì)產(chǎn)生影響,用戶判斷未必精確.查看全部
-
響應(yīng)式布局: 服務(wù)器端根據(jù)不同的瀏覽器客戶端,然后在瀏覽器當(dāng)中為用戶呈現(xiàn)不同網(wǎng)頁的頁面。[1]讓一個(gè)網(wǎng)站可兼容不同分辨率的設(shè)備 [2]給用戶更好的視覺使用體驗(yàn) 移動(dòng)互聯(lián)網(wǎng)催生了響應(yīng)式布局的誕生。查看全部
-
誕生背景查看全部
舉報(bào)
0/150
提交
取消