網頁自適應
提問問題
列表
-
dreamweaver做手機網頁的時怎么讓網頁100%自適應鋪滿屏幕，就是不能讓它縮放？
查看答案>>
-
CSS中如何設拉伸背景圖片鋪滿屏幕
查看答案>>
-
如何把一個pc頁面自適應手機屏幕
查看答案>>
-
CSS中如何設拉伸背景圖片鋪滿屏幕
查看答案>>
-
自適應手機屏幕代碼
查看答案>>
-
div內文字顯示兩行，超出兩行部分省略號顯示css能實現么？
查看答案>>
-
求CSS3字體自適應大小的方法！~
查看答案>>
-
html5手機頁面背景圖片自適應大小問題
查看答案>>
-
css圖片自適應手機屏幕
查看答案>>
dreamweaver做手機網頁的時怎么讓網頁100%自適應鋪滿屏幕，就是不能讓它縮放？
html5默認允許用戶縮放頁面，如果需要禁止縮放，我們需要將user-scalabel=0設置下，具體代碼如下：<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />注意:meta在head里。
CSS中如何設拉伸背景圖片鋪滿屏幕
background:url(images/beijing.png) repeat;加個屬background-size:100%;background:url(images/beijing.png) no-repeat;
如何把一個pc頁面自適應手機屏幕
無論是電腦還是手機，要做到自適應屏幕，其實都是一樣的。首先，在網頁代碼的頭部，加入一行viewport標簽<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />viewport是網頁默認的寬度和高度，上面這行代碼的意思是，網頁寬度默認等于屏幕寬度（width=device-width），原始縮放比例（initial-scale=1）為1.0，即網頁初始大小占屏幕面積的100%。即讓viewport的寬度等于物理設備上的真實分辨率，不允許用戶縮放。其次：網頁寬度css一定要使用百分比width: xx%;，不能用絕對像素。當然可以用width:auto;第三，流動布局.left{float: left;width: ***%;}第四，選擇加載css這是自適應的關鍵部分.abc{ height:300px; border:1px solid #000; margin:0 auto} @media screen and (min-width: 1201px) { .abc {width: 1200px} } /* 設置了瀏覽器寬度不小于1201px時 abc 顯示1200px寬度 */ @media screen and (max-width: 1200px) { .abc {width: 900px} } /* 設置了瀏覽器寬度不大于1200px時 abc 顯示900px寬度 */ @media screen and (max-width: 901px) { .abc {width: 200px;} } /* 設置了瀏覽器寬度不大于901px時 abc 顯示200px寬度 */ @media screen and (max-width: 500px) { .abc {width: 100px;} } /* 設置了瀏覽器寬度不大于500px時 abc 顯示100px寬度 */ 需要注意是CSS代碼順序，由大到小排版CSS（判斷瀏覽器寬度越大越放前），這樣是因為邏輯關系，@media 判斷CSS排錯將導致判斷失效。第四，圖片自適應img { max-width: 100%;}老版本的IE不支持max-width，所以只好寫成：img { width: 100%; }篳五、采用相對字體大小字體也不能使用絕對大?。╬x），而只能使用相對大小（em）。這里最重要的，是第三條和第四條，也就是采用流動布局和css選擇加載。祝你好運！
CSS中如何設拉伸背景圖片鋪滿屏幕
background:url(images/beijing.png) repeat;加個屬background-size:100%;background:url(images/beijing.png) no-repeat;
自適應手機屏幕代碼
你確定你加的對嗎，你再試試<meta name="viewport" content="width=device-width"><meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
我加的就是這句話，不管用的。我一直在想是不是我代碼寫的有問題，我想知道加這段代碼有什么要求嗎？比如寫頁面必須用百分比還是固定值什么的？或者別的地方還要注意寫什么？
我就說說的經驗吧，因為我也做過移動端的頁面。首先就是自適應（說白了就是用百分比來設寬度），最外框肯定是用百分比的，但是一些小的部分就不能用百分比了，不然就會變形，就比如你說的圖片，圖片盡量定死了，不然不同的手機屏幕大小不一定，所顯示的就不一樣，甚至會變形了。你可以通過控制圖片外面的DIV來控制位置，讓它在符合美學的位置。這些是我的經驗，但是，都是我自己摸索的，正確與否就你自己驗證了
div內文字顯示兩行，超出兩行部分省略號顯示css能實現么？
通常的做法是這樣的：1.overflow:hidden;2.text-overflow:ellipsis;3.-o-text-overflow:ellipsis;4.white-space:nowrap;5.width:100%;其中，overflow: hidden和white-space: nowrap都是必須的否則不會顯示省略號；-o-text-overflow: ellipsis針對Opera；而寬度的設定主要是針對IE6；該方法支持Internet Explorer, Safari, Chrome 和 Opera，但FF并不支持，不過可以通過Jquery來實現類似的效果。下載Jquery插件：jQuery ellipsis plugin調用方法：1.$(document).ready(function() {2. $('.ellipsis').ellipsis();3.}
求CSS3字體自適應大小的方法！~
請使用”相對長度單位“ em ,相對于當前對象內文本的字體尺寸。如當前對行內文本的字體尺寸未被人為設置，則相對于瀏覽器的默認字體尺寸。所有瀏覽器支持例如： font-size:1em;
html5手機頁面背景圖片自適應大小問題
首先需要div布局，HTML布局：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"><title>背景圖片自適應</title><style type="text/css">html,body {padding: 0;margin: 0;}div {width: 100%;height: 300px;background: url('images/slide_01_640x340.jpg') no-repeat;background-size: 100% 100%;}</style></head><body><div></div></body></html>2.HTML代碼的截圖效果：3.自適應最重要的樣式如下：<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">width: 100%;background-size: 100% 100%;4.最終的效果是這樣：
css圖片自適應手機屏幕
1）按你的操作，讀取當前的寬度然后設置到樣式中：var h = $(window).width(); $(".mymsg").css("width", h);2）css操作：設置一個div，設置div的寬度為100%，然后設置img的寬度為100%
