一、grid
1、描述：網格，自定義行和列，並通過行列的數量、行高列寬來調整控制項的布局，近似於html中的table。
2、特點：
（1）可以定義任意數量的行和列，非常靈活
（2）行的高度和列的寬度可以使用絕對值、相對比例、自動調整的方式進行精確設定，並可以設定最大和最小值。
（3）內部元素可以設定自己所在的行和列，還可以設定自己縱向跨幾行，橫向跨幾列。
（4）可以設定children元素的對齊方向。
3、應用場合：
（1）ui布局的大框架設計
（2）大量ui元素需要成行或者成列對齊的情況。
（3）ui尺寸改變的時候，元素需要保留固有的寬度和高度比例
（4）ui後期可能有較大的變更或擴充套件。
二、stackpanel
1、描述：棧式面板。可將包含的元素在水平或垂直方向排成一條線，當移除乙個元素後，後面的元素會自動向前填充空缺。
2、使用場合：
（1）同類元素需要緊湊排列（如製作選單和列表）
（2）移除其中的元素後能夠自動補缺的布局或者動畫。
三、canvas
1、描述：畫布，內部元素可以使用以畫素為單位的絕對座標進行定位，類似於windows form的布局方式。
2、使用場合：
（1）一經設計，基本上不用再有改動的小型布局（如圖示）
（2）藝術性較強的布局
（3）需要使用大量縱橫座標來進行絕對定位的布局。
（4）依賴縱橫座標的動畫
四、dockpanel
1、描述：泊靠式面板，內部元素可以選擇泊靠的方向，類似於winform中設定控制項的dock屬性。
1、描述：自動折行面板，內部元素在排滿一行後能夠自動折行，類似於html中的流式布局。
四種簡單實用的左固定右自適應簡單布局
第一種 利用浮動 布局 a b兩個盒子 a為左邊盒子 b為右邊盒子 a設定固定寬度 左浮動 b設定左外邊距 a的寬度 第二種 flex彈性布局 布局 採用flex布局的元素，稱為flex容器 flex container 簡稱 容器 該方法我不太理解 但是確實特別好用 大盒子設定display fl...
有關於css的四種布局
右側自適應佔滿。如下 左右兩側，左側固定寬度200px，右側自適應佔滿 如下 first,second first secondx 如下 上中下三行，頭部200px高，底部200px高，中間自適應佔滿 如下 left,center,right left center right 如下 上中下三行，頭...
常見的四種前端布局方式
1.自適應 2.響應式 3.靜態 4.流式 剛剛接觸網頁設計的時候，常常分不清響應式布局和自適應布局，其實他們就是 傻傻分不清楚 即傳統web設計，對於pc設計乙個layout，在螢幕寬高有調整時，使用橫向和豎向的滾動條來查閱被遮掩部分 對於移動裝置，單獨設計乙個布局，使用不同的網域名稱如wap.或...