Ⅰ 如何製作手機自適應網頁
打開你需要製作手機網頁的html或者php等等網頁源碼文件。在<head></head>之間加入meta標簽。
2
向瀏覽器聲明該網頁為移動設備自適應網頁的meta標簽為：
<meta
name="viewport"
content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
3
將以上標簽加入之後保存，再用手機打開即是自適應網頁了。
Ⅱ 怎麼讓網頁自動適應各個手機瀏覽器
1 . 第一種：
第一個想法是需要使用一個 css 背景圖，如果這張圖夠大，就能填充整個屏幕。當瀏覽器窗口大小沒有圖片大時，它將自動隱藏多餘的部分。
<head> .... <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { $("img.source-image").hide(); var $source = $("img.source-image").attr("src"); $('#page-body').css({ 'backgroundImage': 'url(' + $source +')', 'backgroundRepeat': 'no-repeat', 'backgroundPosition': 'top center' }); }); </script> </head> <body id="page-body"> <img class="source-image" src="images/image.jpg" alt="" /> </body>
上面的這些代碼能夠自動隱藏超出瀏覽器窗口部分的圖片(image.jpg)多餘部分，不會使瀏覽器產生滾動條。
2 . 第二種：
第一次試驗的效果並沒有達到要求，並不是真的使得背景圖片適應窗口大小，應該使用設置「寬度」和「高度」屬性來控制圖片的大小，如果我們能夠得到瀏覽器窗口顯示像素，就可以利用這個數字來控制圖片大小，同時保持比例。
使用 jquery 和 dimensions plugin 可以獲得這些參數。
<script type="text/javascript" src="/js/jquery.js"></script> <script type="text/javascript" src="/js/jquery.dimensions.js"></script> <script type="text/javascript"> $(document).ready(function() { var $winwidth = $(window).width(); $("img.source-image").attr({ width: $winwidth }); $(window).bind("resize", function(){ var $winwidth = $(window).width(); $("img.source-image").attr({ width: $winwidth }); }); }); </script>
為了讓這張圖片更像一個背景圖像，我們設置：
img.source-image {position: absolute;top: 0;left: 0;}
因為背景圖片加上了定位代碼，那要加在背景圖片上任何東西都需要定位，如果您的背景圖像是豎條狀的（特別的高），而你的瀏覽窗口特別的寬，很容易造成背景圖片高度超過您的瀏覽器窗口的高度，為了防止這種情況，需要設定對超出的部分進行隱藏：
body {overflow: hidden;}
3 . 第三次方法（最好的）：
Stu Nicholls version給出了最好的方法(看了下網易的首頁也是這樣做的)，這處理方式不需要任何的 JavaScript 就能完美的達到目的。
#img.source-image {width: 100%;position: absolute;top: 0;left: 0;}
在 css 里直接設定背景圖片寬度的百分比，這是這個方法的效果。這個方法是最好的，而且不需要任何的 JavaScript 。
Ⅲ 如何讓網頁自適應手機屏幕解析度
前台樣式不同解析度下樣式不一樣就行，可以去學習一下前端知識，再回來慢慢寫就可以了』，還不會的話俺可以提供技術幫助
Ⅳ 移動web怎麼做屏幕適配
業內比較流行的做法（參考阿里的flexible），有以下要點：
1、設置viewport為設備寬度（這里不一定，但目前先這樣足矣）
2、將viewport分成10rem，並計算出1rem在當前瀏覽器的像素值，把它賦予html標簽的font-size（分成10rem只是為了方便計算而已）
3、寫CSS代碼時，遇到要適配的地方，比如width，margin，padding等，就不要再用px了，改成用rem
JS和Html代碼如下：
CSS代碼做了類似如下的修改：
運行結果如下：邊距和頭像圖片都隨屏幕變化而變化了。
Ⅳ 寫web端跟寫自適應的pc端手機端有什麼不一樣呢。
手機的屏幕比較小。
當頁面在手機上顯示的時候，布局可能會和PC 的效果不同。
比如說：
兩欄自適應布局中。pc端可能是兩欄，但在小屏手機中，可能就是一欄了。
Ⅵ 如何讓網站自適應手機
關於網站如何做到自適應網頁，可根據如下操作：
首先，在網頁代碼的頭部，加入一行viewport元標簽。<metaname=」viewport」content=」width=device-width, initial-scale=1″ />viewport是網頁默認的寬度和高度，上面這行代碼的意思是，網頁寬度默認等於屏幕寬度(width=device-width)，原始縮 放比例(initial-scale=1)為1.0，即網頁初始大小占屏幕面積的100%。
由於網頁會根據屏幕寬度調整布局，所以不能使用絕對寬度的布局，也不能使用具有絕對寬度的元素。這一條非常重要。
「流動布局」的含義是，各個區塊的位置都是浮動的，不是固定不變的。float的好處是，如果寬度太小，放不下兩個元素，後面的元素會自動滾動到前面元素的下方，不會在水平方向overflow(溢出)，避免了水平滾動條的出現。
「自適應網頁設計」的核心，就是CSS3引入的Media Query模塊。它的意思就是，自動探測屏幕寬度，然後載入相應的CSS文件。同一個CSS文件中，也可以根據不同的屏幕解析度，選擇應用不同的CSS規則。
其次，除了布局和文本，」自適應網頁設計」還必須實現圖片的自動縮放。有條件的話，最好還是根據不同大小的屏幕，載入不同解析度的圖片。有很多方法可以做到這一條，伺服器端和客戶端都可以實現。
Ⅶ 手機web版的頁面（html/css）怎麼兼容所有瀏覽器和各個手機屏幕解析度
你說的這個問題，應該算的上是手機適配的問題！
既然是手機web端頁面，這里的尺寸應該指的是瀏覽器的可視區域！
同樣是5寸屏，一些有問題一些木有問題。
那他們的不同點就在於瀏覽器的可視區域不一樣。
針對這類極小部分的適配問題。可以通過。css適配做出適當調整：
//手機瀏覽器是這個最大區域(可視區域375px)時，應用這個裡面的樣式
@mediascreenand(max-height:375px)
{
}
//手機瀏覽器是這個最小區域(可視區域375px)時，應用這個裡面的樣式
@mediascreenand(mim-height:375px)
{
}
//手機瀏覽器是這個最大區域(可視區域375px)介於345-75時，應用這個裡面的樣式
@mediascreenand(mim-height:375px)and(mim-height:775px)
{
}
具體你可以參考這個：
http://www.ibm.com/developerworks/cn/web/wa-cssqueries/
Ⅷ 做個手機頁面怎麼才能適配不同的手機
一般來說，iH5的手機案例默認的尺寸是640*1040px，也就是iPhone6 plus的尺寸，我用的正是iPhone6 plus，所以我做案例時沒出現過這類問題，而你遇到案例呈現不完整的情況我想應該是手機型號的不同導致的。
你可以設置舞台或者設備的屬性，舞台裁剪為no，如果用的是短款手機觀看作品，有滾動條也可以看到完整的案例。
如果你想要實現完美適配，可以做三個設備，寬度均為640，高度可設置為1040（iPhone6 plus）、1008（iPhone5s和大部分Android手機）、832（iPhone4s）。
希望我的回答對你有幫助
Ⅸ HTML網頁如何自動適應手機屏幕
在網頁代碼的頭部，加入一行viewport元標簽。viewport是網頁默認的寬度和高度，上面這行代碼的意思是，網頁寬度默認等於屏幕寬度（width=device-width），原始縮放比例（initial-scale=1）為1.0，即網頁初始大小占屏幕面積的100%。所有主流瀏覽器都支持這個設置，包括IE9
不使用絕對寬度由於網頁會根據屏幕寬度調整布局，所以不能使用絕對寬度的布局，也不能使用具有絕對寬度的元素。這一條非常重要。只能指定百分比寬度
相對大小的字體字體也不能使用絕對大小（px），而只能使用相對大小（em）。
Ⅹ 如何開發手機端網頁，如何讓網頁自適應
利用bootstrap框架中的柵格可以很快就上手pc端和移動端的自適應。