-
css3 - Media Query
常見的屬性：
device-width，device-height? --? 屏幕寬高
width，height? ? ? ? ? ? ? ? ? ? ? ? ? --? 渲染窗口寬高
orientation????????????????????????????????--? 設(shè)備方向
resolution????????????????????????????????? --? 設(shè)備分辨率
查看全部 -
分辨率改變css的樣式
查看全部 -
1
查看全部 -
來咯ljlebl查看全部
-
移動互聯(lián)網(wǎng)的多終端顯示
查看全部 -
響應(yīng)式設(shè)計
查看全部 -
CSS3-Media Query:
device-width, device-height 屏幕寬高
width, height: 渲染窗口寬高
orientation 設(shè)備方向
resolution 設(shè)備分辨率
查看全部 -
三種方式實現(xiàn)響應(yīng)式:js原生，css3media query，bootstrap等框架查看全部
-
響應(yīng)式設(shè)計的原則
移動優(yōu)先：
1：在設(shè)計的初期就要考慮的頁面如何在多終端展示
漸進(jìn)增強(qiáng)
1：充分發(fā)揮硬件設(shè)備的最大功能
查看全部 -
響應(yīng)式布局的優(yōu)點和缺點
優(yōu)點：
1：解決了設(shè)備只見的差異化展示
缺點：
1：兼容性代碼多，工作量大，加載速度受影響。
2：對原有網(wǎng)站對布局會產(chǎn)生影響，用戶判斷未必準(zhǔn)確
查看全部 -
響應(yīng)式設(shè)計
1：讓一個網(wǎng)站可兼容不同分辨率的設(shè)備
2：給用戶更好的視覺使用體驗
查看全部 -
css3-Media Query
常見的屬性：
device-width,device-height---屏幕寬高
width,height---渲染窗口寬高
orientation---設(shè)備方向
resolution----設(shè)備分辨率
查看全部 -
bootstrap是移動優(yōu)先框架，要求寫<meta name="viewport" content="width=device-width,initial-scale=1.0">
引用bootstrap <link href="css/bootstrap.min.css" rel="stylesheet">
IE8、IE9需要引入respond.js:
查看全部 -
Bootstrap框架可以解決低端瀏覽器不支持css3屬性的問題，還能解決不同的分辨率設(shè)備上網(wǎng)頁的布局展示
Bootstrap:1.移動優(yōu)先的簡單框架? 2.好處是寫非常少的代碼即可實現(xiàn)多終端的頁面適配
類似IE8這種古老的瀏覽器，不支持media query,? 需要引入Respond.js 去激活media query,Respond.js必須部署在websever域名下，不能在靜態(tài)資源域名,存在跨域
查看全部 -
@media screen and (min-width:480px){
????????body{background:blue;}
}
????當(dāng)屏幕大于480 背景變成藍(lán)色
查看全部 -
<link type="text/css" rel="stylesheet" href="link.css" media="only screen and (max-width:480px)">外鏈引入? ? ? ?
當(dāng)屏幕小于480的時候才能引用
查看全部 -
如何實現(xiàn)響應(yīng)式布局
CSS3-Media Query(最簡單的方式)
借助原生Javascript(成本高，不推薦使用)
第三方開源框架（可以很好的支持瀏覽器響應(yīng)式布局的設(shè)計）
查看全部 -
響應(yīng)式設(shè)計的原則
移動優(yōu)先：在設(shè)計的初期就要考慮的頁面如何在多終端展示
漸進(jìn)增強(qiáng):充分發(fā)揮硬件設(shè)備的最大功能（IE6、IE7、IE8等低端瀏覽器不支持CSS3的屬性，需要用javascript方法hack完善交互，但在高端瀏覽器和支持css3屬性的瀏覽器 充分發(fā)揮硬件設(shè)備的功能，給用戶帶來更完美的體驗）
查看全部 -
一、響應(yīng)式設(shè)計優(yōu)? ??
?1》 優(yōu)點：解決了設(shè)備只見的差異化展示? ??
? 2》 缺點：兼容性代碼多，工作量大，加載速度受影響??
? ? ? ? ? ? ? ? ? ?對原有網(wǎng)站布局會產(chǎn)生影響，用戶判斷未必精確
查看全部 -
一、什么是響應(yīng)式設(shè)計：1.讓一個網(wǎng)站可兼容不同分辨率的設(shè)備 2.給用戶更好的視覺使用體驗
二.移動互聯(lián)網(wǎng)催生了響應(yīng)式布局的誕生
查看全部 -
該套課程有提煉，有介紹思想，主要收獲： 媒體查詢； 刪格化布局； 組件。查看全部
舉報