哪些布局形式是移動設備中常用的

① 靜態網頁設計製作中的布局模式

一、靜態布局（Static Layout）

即傳統Web設計，網頁上的所有元素的尺寸一律使用px作為單位。

1、布局特點：不管瀏覽器尺寸具體是多少，網頁布局始終按照最初寫代碼時的布局來顯示。常規的pc的網站都是靜態（定寬度）布局的，也就是設置了min-width，這樣的話，如果小於這個寬度就會出現滾動條，如果大於這個寬度則內容居中外加背景，這種設計常見與pc端。

2、設計方法：

PC：居中布局，所有樣式使用絕對寬度/高度(px)，設計一個Layout，在屏幕寬高有調整時，使用橫向和豎向的滾動條來查閱被遮掩部分；

移動設備：另外建立移動網站，單獨設計一個布局，使用不同的域名如wap.或m.。

在移動端開發中採用靜態布局的兩種方式：

（1）在viewport meta標簽上設置width=320，頁面的各個元素也採用px作為單位。通過用JS動態修改標簽的initial-scale使得頁面等比縮放，從而剛好占滿整個屏幕。（見前端開發-web app 變革之rem）

（2）設在viewport meta標簽上設置content"width=640,user-scalable=no，頁面的各個元素也採用px作為單位。由於640px超出了手機寬度，瀏覽器會自動縮小頁面至剛好全屏。

優點：這種布局方式對設計師和CSS編寫者來說都是最簡單的，亦沒有兼容性問題。

缺點：顯而易見，即不能根據用戶的屏幕尺寸做出不同的表現。

二、流式布局（Liquid Layout）

流式布局（Liquid）的特點（也叫"Fluid") 是頁面元素的寬度按照屏幕解析度進行適配調整，但整體布局不變。代表作柵欄系統（網格系統）。

網頁中主要的劃分區域的尺寸使用百分數（搭配min-*、max-*屬性使用），例如，設置網頁主體的寬度為80%，min-width為960px。圖片也作類似處理（width:100%, max-width一般設定為圖片本身的尺寸，防止被拉伸而失真）。

1、布局特點：屏幕解析度變化時，頁面里元素的大小會變化而但布局不變。【這就導致如果屏幕太大或者太小都會導致元素無法正常顯示】

2、設計方法：使用%百分比定義寬度，高度大都是用px來固定住，可以根據可視區域 (viewport) 和父元素的實時尺寸進行調整，盡可能的適應各種解析度。往往配合 max-width/min-width 等屬性控制尺寸流動范圍以免過大或者過小影響閱讀。

這種布局方式在Web前端開發的早期歷史上，用來應對不同尺寸的PC屏幕（那時屏幕尺寸的差異不會太大），在當今的移動端開發也是常用布局方式，但缺點明顯：主要的問題是如果屏幕尺度跨度太大，那麼在相對其原始設計而言過小或過大的屏幕上不能正常顯示。因為寬度使用%百分比定義，但是高度和文字大小等大都是用px來固定，所以在大屏幕的手機下顯示效果會變成有些頁面元素寬度被拉的很長，但是高度、文字大小還是和原來一樣（即，這些東西無法變得「流式」），顯示非常不協調。

三、自適應布局（Adaptive Layout）

自適應布局的特點是分別為不同的屏幕解析度定義布局，即創建多個靜態布局，每個靜態布局對應一個屏幕解析度范圍。改變屏幕解析度可以切換不同的靜態局部（頁面元素位置發生改變），但在每個靜態布局中，頁面元素不隨窗口大小的調整發生變化。可以把自適應布局看作是靜態布局的一個系列。

1、布局特點：屏幕解析度變化時，頁面裡面元素的位置會變化而大小不會變化。

2、設計方法：使用 @media 媒體查詢給不同尺寸和介質的設備切換不同的樣式。在優秀的響應范圍設計下可以給適配范圍內的設備最好的體驗，在同一個設備下實際還是固定的布局。

四、響應式布局（Responsive Layout）

隨著CSS3出現了媒體查詢技術，又出現了響應式設計的概念。響應式設計的目標是確保一個頁面在所有終端上（各種尺寸的PC、手機、手錶、冰箱的Web瀏覽器等等）都能顯示出令人滿意的效果，對CSS編寫者而言，在實現上不拘泥於具體手法，但通常是糅合了流式布局+彈性布局，再搭配媒體查詢技術使用。——分別為不同的屏幕解析度定義布局，同時，在每個布局中，應用流式布局的理念，即頁面元素寬度隨著窗口調整而自動適配。即：創建多個流體式布局，分別對應一個屏幕解析度范圍。可以把響應式布局看作是流式布局和自適應布局設計理念的融合。

響應式幾乎已經成為優秀頁面布局的標准。

1、布局特點：每個屏幕解析度下面會有一個布局樣式，即元素位置和大小都會變。

2、設計方法：媒體查詢+流式布局。通常使用 @media 媒體查詢 和網格系統 (Grid System) 配合相對布局單位進行布局，實際上就是綜合響應式、流動等上述技術通過 CSS 給單一網頁不同設備返回不同樣式的技術統稱。

② 車間設備布置有哪幾種形式，各自有什麼優點，它們各自適用什麼范圍

一般來說有四種。
（1）、產品布置原則（流水線布置）；
此布置適用於少品種大批量生產情況，優點就是物流量少，搬運距離短，生產周期短，庫存壓力少。缺點就是設備利用率低，設備備用零部件庫存可能比較大。
（2）、工藝布置原則（機群式布置）；
此布置適合於多品種小批量場合。它的優點是機器設備利用率高，設備和人員方面的柔性高，設備投入相對較少，作業多樣化，利於員工發展。缺點就是物流量大，生產計劃與控制復雜，生產周期長，對員工技能要求高。
（3）、固定式布置（項目布置）；
它是工程項目和大型產品生產採用的一種布置形式，適用於生產對象笨重而難移動的產品的場合。 它的加工對象位置，生產工人和設備都隨加工產品所在的某一位置而轉移。如工程建設、飛機廠、造船廠、重型機器廠等。 缺點就是場地空間有限，組織管理難度較大，物流需求動態變化。
（4）、成組布置原則（混合布置）；
成組技術就是識別和利用產品零部件的相似性，將零件分類。一系列相似工藝要求的零件組成零件族。針對一個零件族的設備要求所形成的一系列機器，稱作機器組（製造單元）。
成組原則布置可以認為是產品原則布置的縮影，是將工藝原則布置系統轉化為接近產品原則布置系統。
希望對你有所幫助！！

③ HTML裡面有幾種布局方式

1.自然布局。

沒有任何修飾的布局是自動靠左的。

2.流動布局

上面講的float:left的情況。

3.定位布局

相對定位和絕對定位都是相對於父div標簽的。

相對------以這個元素的本來應該在的位置為參照點

絕對——以父div標簽的原點（左上角）為參照點。

由於外層是position:relative，所以里層是absolute的話，則會以外層的左上角為位移參考對齊。當然外層只寫position:relative，寫上left,top這兩個值，則表示以：以這個元素的本來應該在的位置為布局參照原點進行left,top對齊。

還有一種情況是，只是一個position:absolute;外層沒有position:relative，這時會找尋那個點為參考呢？這時候的原則是：如果某父級元素中有relative者，則以某父級元素為參考原點，如果沒有position:relative，則以body為參考原點。如果position:absolute外層沒有relative時，這兩個布局上是沒有區別的。

當然最後一種情況是：外層是：position:absolute;里邊是position:relative，那會是什麼情況？按著原來的原則，absolute會參考body為布局原點，relative會參考他本來應該在的位置為布局原點，這時候其實就是參考外層左上角為布局原點。

④ app設計中，常用的界面布局方式有哪些

豎排列表。視覺上整齊美觀，常用於並列元素的展示，包括目錄、分類、內容等。
橫排方塊。把並列元素橫向顯示的一種布局。常見的工具欄，TAB，Coverflow
等都採用這種布局。
九宮格。TAB、多面板、彈出框。
手風琴。用戶點擊分類可展開顯示二級內容，在不用的時候，內容是隱藏的。可承載比較多的信息，同時保持界面簡潔。
抽屜/側邊欄。抽屜也是將內容先藏起來，在需要時再展開。
標簽。在搜索界面和分類界面時，會採用標簽的方式來展現。標簽方式比較動感的，增加了應用的趣味性，但使用場景有限。

⑤ 什麼是響應式布局

響應式布局設計，是指將桌面設備上的網頁內容在移動設備上進行優化排版，使用戶能夠在移動設備上更方便地閱讀並操作。其實，如果經常使用不同的設備瀏覽互聯網網頁，就會比較容易體會響應式布局設計在移動設備上的應用。

頁面的設計根據使用設備環境進行相應的響應和調整，具體的實踐方式由多方面組成的。最主要的是三種技術實現的：

布局響應是對頁面進行設計，需要對相同的內容進行不同的布局設計。一種是桌面向下設計，一種是移動端向上的設計。無論那種設計，都要兼容所有的設備。

隨著大屏幕移動設備的普及，隨著越來越多的設計師採用這個技術，我們不僅看到很多的創新，還看到了一些成形的模式。給我們提供了更加舒適的界面體驗。

⑥ 響應式布局是哪三種設備

PC，iPad ，移動設備

⑦ 靜態、自適應、流式、響應式四種網頁布局有什麼區別

1、靈活性不同：

靜態布局：毫無靈活性可言，目前已逐漸被淘汰。

自適應布局：靜態布局的升級版，因其強大的靈活性，已逐漸成為高端網頁的代名詞。

流式布局：靈活性更高，可適用於其他三種網站布局。

響應式布局：自適應布局的升級版，響應式網站要普遍適應市面上各類屏幕，開發難度和工作量都是非常大的，開發價格自然比普通網站高。

2、設計方法不同：

靜態布局：居中布局，所有樣式使用絕對寬度/高度(px)，設計一個Layout，在屏幕寬高有調整時，使用橫向和豎向的滾動條來查閱被遮掩部分。

自適應布局：使用 @media 媒體查詢給不同尺寸和介質的設備切換不同的樣式。

流式布局：使用百分比定義寬度，高度大都是用px來固定，可以根據可視區域 (viewport) 和父元素的實時尺寸進行調整，盡可能的適應各種解析度。

響應式布局：媒體查詢+流式布局。使用@media媒體查詢和網格系統配合相對布局單位進行布局，就是綜合響應式、流動等上述技術通過 CSS 給單一網頁不同設備返回不同樣式的技術統稱。

(7)哪些布局形式是移動設備中常用的擴展閱讀：

靜態、自適應、流式、響應式四種網頁布局的特點概括

1、靜態布局：即傳統Web設計，網頁上的所有元素的尺寸一律使用px作為單位。不管瀏覽器尺寸具體是多少，網頁布局始終按照最初寫代碼時的布局來顯示。

2、流式布局：頁面元素的寬度按照屏幕解析度進行適配調整，但整體布局不變。這就導致如果屏幕太大或者太小都會導致元素無法正常顯示。

3、自適應布局：分別為不同的屏幕解析度定義布局，即創建多個靜態布局，每個靜態布局對應一個屏幕解析度范圍。

4、響應式布局：分別為不同的屏幕解析度定義布局，同時，在每個布局中，應用流式布局的理念，即頁面元素寬度隨著窗口調整而自動適配。

⑧ 請問web頁面布局包括哪些都有什麼用

1.靜態布局（Static Layout）

即傳統Web設計，對於PC設計一個Layout，在屏幕寬高有調整時，使用橫向和豎向的滾動條來查閱被遮掩部分；
意思就是不管瀏覽器尺寸具體是多少，網頁布局就按照當時寫代碼的布局來布置；
對於移動設備，單獨設計一個布局，使用不同的域名如wap.或m.。

2、彈性布局

彈性布局是CSS3引入的強大的布局方式，用來替代以前Web開發人員使用的一些復雜而易錯hacks方法（如使用float進行類似流式布局）。

其中flex-flow是flex-direction和flex-wrap屬性的簡寫方式，語法如下：

flex-flow: <flex-direction> || <flex-wrap>

flex-direction: row（初始值） | row-reverse | column | column-reverse

flex-wrap: nowrap（初始值） | wrap | wrap-reverse

flex-direction定義了彈性項目在彈性容器中的放置方向，默認是row，即行內方向（一般而言是由左往右，但注意這個和書寫模式有關）。

flex-wrap定義是否需要拆行以使得彈性項目能被容器包含。*-reverse代表相反的方向。

兩者結合起來即flex-flow屬性就確定了彈性容器在main axis和cross axis兩個方向上的顯示方式，下面的例子很直觀的說明了各個屬性值的區別：

3、自適應布局（Adaptive Layout）

自適應布局（Adaptive）的特點是分別為不同的屏幕解析度定義布局。布局切換時頁面元素發生改變，但在每個布局中，頁面元素不隨窗口大小的調整發生變化。
你可以把自適應布局看作是靜態布局的一個系列。
就是說你看到的頁面，裡面元素的位置會變化而大小不會變化；

4、流式布局（Liquid Layout）

流式布局（Liquid）的特點（也叫」Fluid」) 是頁面元素的寬度按照屏幕進行適配調整，主要的問題是如果屏幕尺度跨度太大，那麼在相對其原始設計而言過小或過大的屏幕上不能正常顯示
。
你看到的頁面，元素的大小會變化而位置不會變化——這就導致如果屏幕太大或者太小都會導致元素無法正常顯示。

5、響應式布局（Responsive Layout）

做手機網站必加的一句頭部(head)代碼

<metaname="viewport"
content="width=device-width,
initial-scale=1.0,minimum-scale=1.0,
maximum-scale=1.0,
user-scalable=no">

name="viewport"
名稱=視圖width=device-width
頁面寬度=設備寬度(可以理解為獲取你手機的屏幕寬度)initial-scale-初始的縮放比例 minimum-scale-允許用戶縮放到的最小比例 maximum-scale-允許用戶縮放到的最大比例 user-scalable-用戶是否可以手動縮放

分別為不同的屏幕解析度定義布局，同時，在每個布局中，應用流式布局的理念，即頁面元素寬度隨著窗口調整而自動適配。
可以把響應式布局看作是流式布局和自適應布局設計理念的融合。
每個屏幕解析度下面會有一個布局樣式，同時位置會變而且大小也會變。

⑨ android中常見的五種布局有什麼特點

1，FrameLayout，特點：所有的View都會放在左上角，並且後添加進去的View會覆蓋之前放進去的View。

2，LinearLayout，特點：在水平或者垂直方向上依次按照順序來排列子元素，控制項的排列順序遵循其在布局文件中被寫出的先後順序。

3，RelativeLayout，特點：以某一個子元素為參照物，其餘子元素均按照其相對位置來完成布局。

4，TableLayout，特點：每個TableLayout都是由一個或多個TableRow組成的，一個TableRow就代表TableLayout的一行。

5，AbsoluteLayout，表格布局類似Html裡面的Table。每一個TableLayout裡面有表格行TableRow，TableRow裡面可以具體定義每一個元素，設定他的對齊方式 android:gravity="" 。

(9)哪些布局形式是移動設備中常用的擴展閱讀：

開放性：

在優勢方面，Android平台首先就是其開放性，開發的平台允許任何移動終端廠商加入到Android聯盟中來。顯著的開放性可以使其擁有更多的開發者，隨著用戶和應用的日益豐富，一個嶄新的平台也將很快走向成熟。

開放性對於Android的發展而言，有利於積累人氣，這里的人氣包括消費者和廠商，而對於消費者來講，最大的受益正是豐富的軟體資源。開放的平台也會帶來更大競爭，如此一來，消費者將可以用更低的價位購得心儀的手機。

豐富的硬體：

這一點還是與Android平台的開放性相關，由於Android的開放性，眾多的廠商會推出千奇百怪，功能特色各具的多種產品。功能上的差異和特色，卻不會影響到數據同步、甚至軟體的兼容，如同從諾基亞Symbian風格手機一下改用蘋果iPhone，同時還可將Symbian中優秀的軟體帶到iPhone上使用、聯系人等資料更是可以方便地轉移。