ASP.Net - 遠離使用絕對座標，內聯css和ms_positioning =「GridLayout」

使用VS 2003，我們習慣於設計與贏取窗體非常相似的Web窗體：Textboxes，Labes，Buttons等與使用ms_positioning =「GridLayout」的絕對座標（內聯css）。ASP.Net - 遠離使用絕對座標，內聯css和ms_positioning =「GridLayout」

使用VS 2010這種設計Web窗體的方式似乎已經消失了（至少它不能再用於快速完成設計），絕對座標和內聯css的使用無論如何都被認爲是過時的。

我想獲得一些提示，如何設計網頁表單，如樣本截圖中的「正確」方式。

我想保留下重要的事情：

每個人都應該能夠迅速/輕鬆地添加，刪除或移動窗體的控件，同時保持形態的整體外觀和感覺 - 我們的網頁形式趨向隨着客戶需求的變化而變化/增長。
當用戶縮小瀏覽器窗口的寬度時，表單不應該合在一起 - 表單寬度不應該以最小值下降。

我使用HTML表格考慮，但例如用於地址-塊的樣本截圖我就必須有9列（一列，每垂直邊界）的表格，並使用大量的colspans - 不是neccessarily這是考慮未來變化而設計表格的最快方式。我在1999年左右聽說html表已經過時了。

我讀過我應該使用div和css幾乎所有的東西，但我不清楚如何創建一個像樣例屏幕截圖一樣的web表單，但不提供絕對位置和大小。

任何提示將不勝感激。

預先感謝問候埃裏希·霍拉克

Sample Web Form Screenshot

來源

2011-09-12 Erich Horak

它不是那麼多表過時（他們從來沒有）只是他們不是正確的機制佈局的東西，不是表/表格數據（他們從來沒有...） – Murph

好吧，所以沒有表絕對定位也不是正確的方法。現在考慮樣本表格 - 什麼是正確的方式？ –

@IrishChieftain：正如您在回答我的其他問題時所建議的那樣，我在網上搜索了一些優秀的表單樣本，但我找到的所有示例都是簡單的註冊/登錄或Type-Your-Address-Here表單。「大」的包含幾個標籤 - 文本框 - 換行 - 重複塊的序列。是否像我的示例Web表單太複雜，乾淨的設計方法？ –

我會瓜分你的三個主要部分爲申報單，然後分別處理每個部分。我接觸這個工具時的主要工具是Web Dev Toolbar。我用它來查看任何形式的標記和CSS我找到網上說我喜歡的樣子：

https://addons.mozilla.org/en-US/firefox/addon/web-developer/

（CSS - >查看CSS和CSS - >查看樣式信息（懸停鼠標）是有益的降省電選項）

形式主要是通過使用標籤和輸入類的用CSS創建： http://speckyboy.com/2011/05/24/css-form-templates-tools-services/

你的形式看起來很難在乍看之下，但是當你打破它，它真的不是那麼難做。上面的鏈接有樣本 - 就像你提到的那樣簡單 - 但很簡單，CSS是相同的。

來源

2011-09-12 19:49:16 IrishChieftain

謝謝你的回答，你的時間你願意投資。但是，您發佈的第一個示例鏈接（http://jeffhowden.com/code/css/forms/）的CSS充滿了寬度：354px或邊距：0 0 0 144px，目前的speckyboy.com鏈接幾乎相同。也許我過於生疏或笨拙，但對於我來說，這個固定的像素值與使用絕對座標的原理相同：「margin 144px」或「left 144px」 - 我看不出有什麼重大區別。 –

固定寬度與絕對定位不一樣。我大多使用固定寬度的內部應用程序，因爲我事先知道各種屏幕分辨率，另外我不喜歡流體設計。只需從一小部分開始，並嘗試 - 如果您有任何其他問題 - 在這裏發佈:) – IrishChieftain

ASP.Net - 遠離使用絕對座標，內聯css和ms_positioning =「GridLayout」

回答

相關問題