手機網站怎么做？
來源：領眾品牌 查看次數： 發表時間：2014-06-04 18:57:23手機網站怎么做？如今很多企業對移動終端手機等設備也建設了網站，今天就說說手機網站怎么做吧，其實做的有很多共有以下幾個方法，這些 方法哪種更適合我們呢？
方法一：手機WAP網站
采用wap是最傳統的方法之一，一直是很多手機網站建設的首選方法，手機wap網站怎么去做呢？與pc電腦端網站的制作有什么不一樣呢？
1、采用WML語法，其實這與XML是差不多，在制作手機網站的時候我們需要在代碼頂部聲明下：
|
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.1//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>這是一個手機wap網站</title> </head> <body> 手機網站怎么做？ </body> </html> |
2、手機網站的CSS樣式采用百分符更為合適，隨說手機網站與普通網站建設方法是差不多的，但手機種類很大分辨率與大 有不同，這就對CSS樣式要有所規范了，盡量少采用圖片式的布局，如下面的代碼：
|
.concent{ width:100%; height:auto} .concent li{ float:left; width:20%; //采用百分號來控制顯示的寬度 margin-top:5px; margin-bottom:5px; margin-left:5px; margin-right:5px } |
方法二：采用自適應同步跨平臺
這種方是現在大部分手機網站制作的趨勢所在，之前我們網站上有發表過一個相關”廈門做網站建設自適應跨平臺解決方案一站通用“可以了解下，這種自適應式電腦、手機等設備網站怎么去做呢？
1、主要是在代碼頭設置：<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
<html xmlns="http://www.w3.org/1999/xhtml"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> // 開通采用自適應模式 // width - viewport的寬度 height - viewport的高度 // initial-scale - 初始的縮放比例 // minimum-scale - 允許縮放的最小比例 // maximum-scale - 允許縮放的最大比例 // user-scalable - 是否可以手動縮放
<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>這是一個手機wap網站</title> </head> <body> 歡迎進入手 </body> </html> |
2、響應式布局CSS(CSS3) @media screen，自適應的網站更加注重CSS的寫法規則
|
<link rel="stylesheet" type="text/css" href="a.css" media="screen and (min-width: 300px) and (max-width: 400px)"> // 這個就是說當屏幕寬度在300-400像素的時候采用 調用a.ss文件 // 當然如果不這樣調用的話也可以按下面的來做 @media screen and (max-width: 400px) { // 直接寫在css文件中，在文件中來判斷 .main{ widht:300px; } }
|
3、結合Jquery來顯示固定的DIV
很多時候光靠CSS來自適應的話，很多都不能達到好的效果，如果你能懂些Jquery最好了，比如網站上面的導航條，我們 就可以動態的判斷網頁屏幕寬度多少時來顯示隱藏DIV框架。如果你不很清楚的話，建議去”www.w3school.com.cn“網站上學下，其實不難。
方法三：手機APP網站獨立制作
作者：一名
12年資深網站設計師 前端交互開發工程師相關文章：
-
領眾教您怎么免費建設網站
都說網站建設是個技術活，但如果你能看完我們下面說的內容，也許您就可能自己建個免費的網站哦！不管你是個人還是公司都可以用以下方法去建免費的網站。當然如果還會做設計的話那
2014-01-14 -
廈門手機網站建設用費要多少錢?
廈門手機網站建設用費要多少錢？隨著智能手機用戶量的增加，企業對手機網站的需求也在急劇增加中，移動互聯網中手機網站建設現在也是顯得舉足輕重。一、廈門手機網站建設費用要多
2014-01-14 -
手機移動網站建設設計者就不能錯過
在現在世界上的智能手機使用互聯網的人數已增加在很大程度上，尤其是最近幾年。小工具怪胎人的這種行為已經導致增加移動網站的發展。有移動網站，每一個移動Web開發人員應該采
2013-12-17 -
一個完美的移動網站建設四個關鍵因素
在不斷涌現的技術世界，如果你不保持更新，那么你將被拋出退出市場。為了應付與競爭對手，作為一個開發人員，你應該使用現成的技術來構建您的移動網站?，F在你知道了移動網站的關鍵
2013-12-17 -
利用百度Site App一分鐘免費為您建設手機網站
利用百度Site App一分鐘免費為您建設手機網站，之前與大家分享過百度開發者的一些應用，其實這些應用對于企業來說的話最好的一個就是Site App了，你想為自己的企業建立一個免費的
2013-08-26 -
廈門怎么選擇一家好的網站建設公司
廈門網站建設公司是非常多的，但是真正能服務好客戶的確沒有幾家的，怎么選擇一家好的網站建設公司呢，在幾年也許你一直在看公司門面，但如今那個年代早以過時了，一家好的公司，他們注
2013-08-14 -
手機平臺網站建設的春天以來到
隨著國內外對智能手機的用戶越來越多，不管在那里許許多的年青人手上都拿關手機在聊天上網玩游戲，安卓智能手機的誕生讓傳統的PC網站建設營銷不在是唯一了。隨說在智能手機誕生
2013-06-29