TMS WEB CORE直接從HTML&CSS設計的頁面布局
TMS WEB CORE支持DELPHI IDE中拖放控件，生成HTML UI。這種方式適合DELPHI和C++ BUILDER的程序員開發UI，是不能脫離語言IDE的。
TMS Web core框架也完全開放直接從HTML&CSS設計的頁面布局。框架的架構提供分離設計和代碼，甚至由具有角色的人完成設計，即圖形設計師。
那么，如何處理這種分離呢？幸運的是，以一種非常簡單和直接的方式。這個HTML和UI控件之間的鏈接以及DelphiIDE中使用的代碼基於HTML元素ID。
每個TMS Web核心控件都有一個屬性elementID。當未使用elementID，即保留為空，生成控件所包含的HTML元素，通過TMS Web核心框架。
當指定elementID時，找到了html元素，連接到控件的PASCAL類。這意味着屬性訪問器直接獲取，從HTML元素和各種HTML元素javascript事件中設置的值為
掛接類並公開為Pascal事件處理程序。
下面的例子中，twebMemo通過elementID屬性連接到textfarea html元素ID設置為“mem”，並且已經在HTML文件中。
The software developer and the graphical designer can collaborate by simply ensuring that the
designer provides the HTML element IDs to the software developer or the software developer
can provide a list of IDs of controls needed to the graphical designer. It speaks for itself that
using this technique empowers us to take advantage of responsive design for TMS WEB Core
web applications. When the HTML template for the page is applying responsive design
techniques, i.e. different layouts for different device screen sizes, the UI controls will appear
where the designer defined these should appear depending on the screen size. That is not all
though. It is also possible to let the Delphi designed UI be generated in the body part of a HTML
page or in any specified HTML container element in a HTML page. As such, a graphical
designer could create a page layout with a header, footer and other elements in the HTML page
and add a specific area via a HTML DIV or SPAN element where the Delphi designed UI will be
generated in. To do so, all that is needed is set to the ID for the HTML element where the form
should be generated via the Form.AppContent property. Finally, each UI control also exposes
an ElementClass property. Via this ElementClass property a CSS style can be specified for an UI control. Via this way for example, it is very easy to use a popular framework like bootstrap. It
is sufficient to set the bootstrap CSS class names to the UI controls on the Delphi form designer
by their ElementClass properties.
軟件開發人員和圖形設計人員只需確保Designer向軟件開發人員或軟件開發人員提供HTML元素ID
可以提供圖形設計器所需控件的ID列表。這本身就說明了使用這一技術使我們能夠利用TMS Web core的響應式設計Web應用程序。
當頁面的HTML模板應用響應式設計時技術，即不同設備屏幕大小的不同布局，將顯示UI控件設計師定義的地方，這些應該根據屏幕大小顯示。
不過這不是全部。也可以讓Delphi設計的用戶界面在HTML的主體部分生成。
頁面或HTML頁面中任何指定的HTML容器元素中。因此，圖形設計器可以在HTML頁面中創建具有頁眉、頁腳和其他元素的頁面布局。
並通過一個HTML DIV或SPAN元素添加一個特定的區域，Delphi設計的UI將在其中生成。要做到這一點，只需將表單所在的HTML元素的ID設置為應通過Form.AppContent屬性生成。
最后，每個UI控件還公開elementClass屬性。通過此elementClass屬性，可以為UI控件指定CSS樣式。例如，通過這種方式，很容易使用一個流行的框架，比如引導程序。
它足以將引導CSS類名設置為Delphi窗體設計器上的UI控件通過它們的elementClass屬性。
TMS Web核心框架中包含的演示之一顯示了這一點。通過簡單的改變通過更改HTML頁面模板中的引用，引導主題Web應用程序將自動適應。
進一步微調設計時設置如何轉換為運行時外觀和布局，可以通過ui控件屬性elementFont和elementPosition。
默認情況下，ui control element字體屬性設置為efproperty。這意味着UI控件字體屬性值將用於生成HTML元素的樣式屬性（如果
elementID和elementClassName為空）。當elementFont設置為efcss時，這意味着HTML元素的字體將由瀏覽器的css解析決定。
elementPosition屬性確定如何將基於表單設計器的坐標用作
HTML元素的樣式屬性。當elementPosition設置為epabsolute（默認值）時，
HTML元素樣式屬性設置為絕對，控件位置和大小將匹配
它是如何在窗體設計器中設計的。當設置為eprelative或epnone時，
HTML元素的布局、位置和大小將由瀏覽器和可能的CSS決定。
應用於HTML元素。