css:构建响应式网站
- 創(chuàng)建可伸縮的圖像
img標(biāo)簽省略設(shè)置width和height , 在樣式表中設(shè)置max-width:100% ,
- 創(chuàng)建彈性布局網(wǎng)格
創(chuàng)建彈性布局的關(guān)鍵是使用百分?jǐn)?shù)來(lái)設(shè)置width,而不要指定固定的寬度值
- 媒體查詢
定義的方式:1)<link rel=''' ?href="" ?media="">
2) 在樣式表中@media screen and (max-width<960px){ }
最常用的是min-width ? max-width
- 理解視覺(jué)區(qū)域以及使用視覺(jué)區(qū)域的meta元素
視覺(jué)區(qū)域(viewport)指的是瀏覽器顯示頁(yè)面的區(qū)域。
<meta name="viewport" ?content="width=device-width, initial-scale=1" >
- 兼容舊版本
通過(guò)條件注釋判斷瀏覽器的版本,選取不同的樣式表
<!--[if gt IE 8]><link ....>?<![endif]--> ?//除IE8及以下的版本外,使用的樣式表
<!--[if lt IE 9]> <link ...> ?<![endif]--> ? ?//用于IE9及以下的版本
轉(zhuǎn)載于:https://www.cnblogs.com/lingLongBaby/p/8582328.html
總結(jié)
以上是生活随笔為你收集整理的css:构建响应式网站的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 阜新到伊犁哈萨克自治州杏树沟路过什么地方
- 下一篇: 加盟蜀辣居鲜货火锅有哪些优势呢?了解过没