利用Dreamweaver CS5.5設計行動裝置網頁
智慧型手機竄紅、平板電腦普及、行動網路發達，讓上網不再是只需要宅在家裡才能做到的事情，不管是走路、等車、坐車、吃飯、蹲馬桶以及許多的時候，都可以利用這些裝置來進入網際網路的花花世界，所以許多的網站也針對這些行動裝置來製作獨立的頁面，甚至根據螢幕尺寸來最佳化頁面。
上面這兩張圖，就是Facebook為了行動裝置而製作的頁面，左邊是iPhone直拿觀賞，右手邊則是橫拿，可以看到在左邊最上排只看到「個人檔案、訊息、更多」，右邊可看到「個人檔案、訊息、朋友、相片、更多」，橫拿比直拿多出了兩個選項，雖然只是小地方，但設計就是要掌握每一個細節，那我們該如何設計這樣的網頁呢？就讓我們慢慢來體驗吧！
很久很久以前在製作網頁的時候，我們可以在同一個頁面使用不同媒體的CSS樣式表來控制顯示內容，例如：
<link href="css/screen.css" rel="stylesheet" type="text/css" media="screen" /> <link href="css/handheld.css" rel="stylesheet" type="text/css" media="handheld" /> <link href="css/print.css" rel="stylesheet" type="text/css" media="print" />
上面的第一行是代表螢幕樣式、第二行為行動裝置樣式、第三行為列印樣式，不過目前有關行動裝置樣式已經因為時代的演進與科技的發達，已經瀕臨淘汰的邊緣了，現在我們製作行動裝置樣式，主要是靠裝置的螢幕寬度來決定不同的樣式表。
在Dreamweaver CS5.5中除了提供多螢幕預覽的模式之外：
還可以針對不同的螢幕尺寸來設定該使用哪個CSS樣式表檔，只要按下多螢幕預覽上方的媒體查詢按鈕。
上面的範例是針對螢幕寬度小於320像素的裝置使用phone.css，螢幕尺寸介於321像素～768像素之間的裝置使用tablet.css，加入了這樣的設定後在頁面內會多出兩段CSS的連結語法：
<link href="css/phone.css" rel="stylesheet" type="text/css" media="only screen and (max-width:320px)" /> <link href="css/tablet.css" rel="stylesheet" type="text/css" media="only screen and (min-width:321px) and (max-width:768px)" />
當然要看你在這兩個CSS中如何設定呈現頁面樣式囉！我的範例是在phone.css裡面將景點圖片的display設為none，另外要注意在<head></head>區段中要加入以下的語法：
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
否則在手機橫向後頁面將會被放大，這樣我們的樣式表就會失效，瀏覽的效果可以參考下面的影片：
可以看到在320像素以下景點圖片會被隱藏，而超過這個大小圖片就會自動顯示，大家也可以自行用行動裝置瀏覽這個網址，也準備這個範例的原始檔讓大家下載研究。
네이버 아이디 구매
네이버 아이디 구매,네이버 아이디 판매 ,네이버 아이디 구매,네이버아이디매입,네이버 아이디 판매
트위터 ID를 구입하기 위한 인기 웹사이트 및 플랫폼
트위터 계정 구매
비아그라 개요
비아그라의 과학: 이작은 파란색 알약이 삶을 변화시키는 방법
비아그라 구매 필요한지 여부를 결정합니다. 여러분의 증상과 의료 기록을 기반으로 비아그라가 적합한지를 평가하게 됩니다.
비아그라(실데나필)는 발기부전(ED, Erectile Dysfunction)을 치료하는 데 효과적으로 사용되는 약물입니다. 다음은 비아그라가 성적 기능 장애를 해결하는 방법에 대한 요약입니다:
레비트라 100mg
레비트라 100mg: 발기부전 치료의 판도를 바꾸는 제품
I would like to thank you for the efforts you have put in penning this site. I’m hoping to see the same high-grade content by you in the future as well. In fact, your creative writing abilities has encouraged me to get my very own site now 😉
비아그라 크기 변화
비아그라와 남성 성기 크기: 사실과 오해
네이버 아이디 구매 비실명 ID 계정 판매
네이버 아이디 구매
I simply desired to appreciate you once more. I do not know the things I would have accomplished in the absence of those smart ideas discussed by you relating to such industry. It was actually the daunting matter in my position, nevertheless noticing your professional strategy you resolved it forced me to cry with fulfillment. Extremely grateful for your information and in addition sincerely hope you really know what a great job you’re providing instructing men and women through your web site. I’m certain you’ve never encountered all of us.
There is apparently a bunch to identify about this. I believe you made various good points in features also.
인스타 계정 판매
인스타계정 판매. 인스타 계정 구매. 인스타 계정 대량 판매. 인스타 아이디 구매.
인스타 계정 구매 사이트.인스타 계정 매입. 인스타 계정 거래.
트위터 계정 판매
트위터 계정 판매, 트위터 계정 매입, 판매 가격, 생성프로그램。
트위터 계정 구매, 트위터 계정 무한생성。
비아그라 여자가먹으면
여성이 비아그라를 복용하면 어떻게 됩니까?
비아그라 부작용 탈모
비아그라와 탈모의 연관성 이해: 알아야 할 사항
최신 연구에서는 비아그라(실데나필)와 관련된 여러 주제들에 대해 다양한 통찰을 제공하고 있습니다. 여기에는 약물의 효능, 안전성, 심리적 효과 등이 포함됩니다.
There are many posts on the market near this, I do believe taking there reference could experience made this spot or article really informative. Practical goal expression this post is unhealthy. Simply I must pronounce that the info provided here was unique, merely so it will be more in close proximity to complete, supporting to former information will receive been actually good. The points you have touched here are vital, thus I am going to spot many of the information here to create this actually best for entirely the newbie’s here. Thank you for this info. Actually helpful!
비아그라 시력
비아그라와 시력: 효과와 주의사항
I blog often and I genuinely appreciate your content. Your article has really peaked my interest. I will take a note of your site and keep checking for new details about once per week. I opted in for your RSS feed too.
발기부전의 진단과 치료 방법
발기부전의 진단과 치료 방법: 남성 건강을 위한 종합 가이드
비아그라 구매방법 의사 상담부터 온라인 구매까지
성적 기능 장애는 남성들 사이에서 흔히 발생하는 문제 중 하나입니다. 이런 문제에 대처하기 위해 비아그라와 같은 약물이 널리 사용되고 있습니다. 그러나 비아그라는 처방전이 필요한 약물로 분류되어 있기 때문에, 올바른 절차를 따라 구매해야 합니다.
인도 비아그라
인도의 비아그라: 사용을 둘러싼 법적 및 윤리적 고려 사항
Spot on with this write-up, I actually believe this site needs much more attention. I’ll probably be back again to see more, thanks for the advice.
남자갱년기 발기부전 조루 같은 문제 있다면
남자 갱년기: 발기부전과 조루 같은 문제에 대한 이해와 관리 방법
네이버 아이디 판매
저희는 네이버 아이디 판매 전문 업체입니다.
우리는 귀사의 요구를 총족시키기 위해 최선을 다하고 있습니다.
남자 강직도 유지
남자 강직도 유지을 위한 7가지 팁
Having read this I thought it was rather informative. I appreciate you finding the time and energy to put this content together. I once again find myself spending way too much time both reading and leaving comments. But so what, it was still worthwhile!
arava ca – cheap arava buy cartidin without prescription
레비트라 효능
레비트라(Levitra)의 효능 활용: 성생활을 어떻게 변화시킬 수 있습니까?
I absolutely love your blog.. Very nice colors & theme. Did you develop this amazing site yourself? Please reply back as I’m planning to create my very own site and would love to learn where you got this from or exactly what the theme is named. Appreciate it!