整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
多數PHP程序都使用HTML表單從用戶那里獲取數據并計算結果。
首先創造一個基本的HTML大綱，包含表單控件；然后將控件進行合并（HTML表單必須包括一個提交按鈕，用戶單擊它可以將表單數據發送到服務器。）一個單獨的HTML頁面可以包含多個表單。
包含表單的HTML結構和和普通的HTML結構一樣。
<HTML>
<HEAD>
<TITLE>標題放在這</TITLE>
</HEAD>
<BODY>
表單頁面放在這
</BODY>
</HTML>在包含表單的HTML頁面中可以使用任何HTML標簽。基本的表單使用FROM標簽來說明。該標簽中METHOD屬性接收GET或POST兩個值中的一個。ACTION屬性子明PHP腳本的url，該腳本可以收集通過表單收集的數據，可以是絕對路徑或者相對路徑。
<FORM METHOD="method" ACTION="url">
中間可以放置表單控件
</FORM>兩個常用的基本控件：文本框和提交按鈕。
文本框：允許用戶鍵入信息以發送給PHP腳本。NAME屬性為文本提供名稱，PHP腳本可以通過名稱準確訪問其內容，因此它應該是唯一的且符合PHP變量命名規則（但不需要$符號），單標簽。VALUE屬性指明出現在提交按鈕上面的標題。創建方式如下：
<INPUT TYPE = "TEXT" NAME="text">提交按鈕：允許用戶將一個表單的內容發送到服務器，一個HTML表單對應應該有一個提交按鈕。
示例：一個完整的HTML表單。
<HTML>
<HEAD>
<TITLE>標題</TITLE>
</HEAD>
<BODY>
<FORM METHOD="POST" ACTION="phpinfo.php">
<INPUT TYPE="TEXT" NAME="user_name">
<BR/>
<BR/>
<INPUT TYPE="TEXT" NAME="user_email">
<BR/>
<BR/>
<INPUT TYPE="SUBMIT" VALUE="Send the Data">
</FORM>
</BODY>
</HTML>可以在一個HTML頁面中包含多個表單，注意下一個表單的FORM開始之前需要結束前一個FORM表單。
<HTML>
<HEAD>
<TITLE>標題</TITLE>
</HEAD>
<BODY>
<FORM METHOD="POST" ACTION="phpinfo.php">
<INPUT TYPE="TEXT" NAME="user_name">
<BR/>
<BR/>
<INPUT TYPE="TEXT" NAME="user_email">
<BR/>
<BR/>
<INPUT TYPE="SUBMIT" VALUE="Send the Data">
<BR/>
<BR/>
</FORM>
<FORM METHOD="POST" NAME="phpinfo.php">
<INPUT TYPE="TEXT" NAME="user_name1">
<BR/>
<BR/>
<INPUT TYPE="TEXT" NAME="user_email1">
<BR/>
<BR/>
<INPUT TYPE="SUBMIT" VALUE="Send the Data1">
</FORM>
</BODY>
</HTML>文本框的屬性中，TYPE和NAME是必須的，其余是可選屬性。SIZE屬性用于設置文本框的可視大小；MAXLENGTH指明用戶鍵入字符的最大長度；VALUE給出了一個最初顯示在文本框中的值。
<input type="text" name="" size="" maxlength="" value="">文本區域可以輸入多行文本。NAME和ROWS屬性是必須的。ROWS屬性表明了文本區域內可以看到的文本行數，充滿時會滾動。COLS屬性指明可見文本列數與行數類似。WRAP屬性指明文本區域內單詞換行的方式，可以指定如下值。該標簽為雙標簽。
值 | 說明 |
off | 禁止單詞換行但用戶可以輸入換行符強制換行 |
virtual/soft | 各行顯示為換行，但是換行并沒有被發送到服務器 |
physica/hard | 啟用了單詞換行 |
<inputarea name="" rows="" cols="" wrap="">創建密碼框的語法與文本框相同，但要將TYPE屬性指定為PASSWORD而不是TYPE。
<input type="password" name="" size="" maxlength="" value="">取兩個值中的一個，即二選一。TYPE屬性是必須的，checked屬性出現，該復選框默認情況會被選定。value屬性指定復選框被選定情況下被發送到服務器的值，默認發送on值。法如下：
<input type="checkbox" name="" checked value="">語法與復選框屬性含義相同，但是TYPE屬性的值必須是RADIO，NAME屬性是必須的。
<input type="radio" name="" checked value="">用戶可以選擇一個或者多個選項，它是一個滾動菜單。
<select name="" multipile size="">options go here</select>name屬性是必須的，multipile屬性指明用戶可以通過按下crtl鍵并單擊多個選項來選擇它們
列表框的單選行為可作為單選按鈕。
<option selected value="text"></options><input type="hidden" name="text"value=""><input type="FILE" name="name" accept="time" value="text">其中type屬性是必須的。格式通過使用MIME碼指定。常用的格式如下：
超文本標記語言文本 .html,.html text/html
普通文本 ：txt text/plain
word文檔：application/msword
RTF文本 ：rtf application/rtf
GIF圖形 ：gif image/gif
JPEG圖形 ：jpeg,
jpg： image/jpeg
au聲音文件：au audio/basic
MIDI音樂文件 ：mid,.midi audio/midi,audio/x-midi
RealAudio音樂文件 .ra, .ram audio/x-pn-realaudio
MPEG文件 .mpg,.mpeg video/mpeg
AVI文件 .avi video/x-msvideo
GZIP文件 .gz application/x-gzip
壓縮文件.rar application/octet-stream
壓縮文件.zip application/x-zip-compressed
TAR文件 .tar application/x-tar
<input type="image" src="url" name="text" align="align"><input type="reset" value="text">業級信息化系統絕大部分采用BS架構實現，如門戶網站、OA系統、電商網站等，通過瀏覽器輸入Web網址即可訪問，對于使用者來說非常便捷，對于開發維護者來說也非常方便，程序維護只需更新服務器即可，使用者無感知。但是CS架構的WinForm客戶端程序仍然具有很實用的價值，如WPS、IT類的集成開發環境（數據庫、圖形處理軟件）、PC端的小工具。本地程序處理性能更優秀，但是頻繁更新帶來不友好的客戶端體驗。還有一種非常常見且實用的業務場景， Web網頁與WinForm程序互相集成應用。
在百度網盤的網頁中，點擊【下載】按鈕，首先會檢查本地是否已經啟動客戶端網盤。如果未啟動，則彈出提示信息告知用戶需要打開客戶端程序進行下載。這就是一個典型的Web網頁中啟動客戶端程序的場景。更形象的應用場景是，WinForn/WPF客戶端程序嵌入Web程序，Web程序的網頁中js調用WinForm/WPF窗體以及業務方法。后面會詳細的介紹。
WinForm程序中集成網頁的基本原理就是通過一個包含類似瀏覽器功能的控件，將Web網頁載入并解析渲染出來。下面主要介紹 WinForm 集成 Web 網頁的幾種實現方式。
談論集成的問題之前，先了解一下瀏覽器的內核。
瀏覽器最重要或者說核心的部分是“Rendering Engine”，可大概譯為“渲染引擎”，不過我們一般習慣將之稱為“瀏覽器內核”。負責對網頁語法的解釋（如標準通用標記語言下的一個應用HTML、JavaScript）并渲染（顯示）網頁。 所以，通常所謂的瀏覽器內核也就是瀏覽器所采用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網頁的內容以及頁面的格式信息。不同的瀏覽器內核對網頁編寫語法的解釋也有不同，因此同一網頁在不同的內核的瀏覽器里的渲染（顯示）效果也可能不同，這也是網頁編寫者需要在不同內核的瀏覽器中測試網頁顯示效果的原因。
內核分類
內核被包含在全世界最高的使用率的操作系統中，即為Windows操作系統，所以我們又經常把它稱之為IE內核。
Trident內核的常見瀏覽器有：
其中部分瀏覽器的新版本是“雙核”甚至是“多核”，其中一個內核是Trident，然后再增加一個其他內核。國內的廠商一般把其他內核叫做“高速瀏覽模式”，而Trident則是“兼容瀏覽模式”，用戶可以來回切換。
Gecko內核常見的瀏覽器：Mozilla Firefox、Mozilla SeaMonkey、waterfox（Firefox的64位開源版）、Iceweasel、Epiphany（早期版本）、Flock（早期版本）、K-Meleon。
WebKit內核常見的瀏覽器：Chrome、傲游瀏覽器3、Apple Safari （Win/Mac/iPhone/iPad）、Symbian手機瀏覽器、Android 默認瀏覽器。
參考網站：https://liulanmi.com/labs/core.html
Blink是一個由Google和Opera Software開發的瀏覽器排版引擎，Google計劃將這個渲染引擎作為Chromium計劃的一部分，并且在2013年4月的時候公布了這一消息。這一渲染引擎是開源引擎WebKit中WebCore組件的一個分支，并且在Chrome（28及往后版本）、Opera（15及往后版本）和Yandex瀏覽器中使用。
瀏覽器內核檢測
https://ie.icoa.cn 可檢測 PC 或手機瀏覽器內核和操作系統類型，包括Google Chrome的WebKit、IE的Trident、ME的Edge、Firefox的Gecko/Servo，以及Windows/MacOS/Linux/iOS/Android等的判斷。
WinForm Browser 控件
微軟WinForm開發框架中老牌控件。
CefSharp是一種將功能齊全的符合標準的web瀏覽器嵌入C#或VB.NET應用程序的簡單方法。CefSharp擁有WinForms和WPF應用程序的瀏覽器控件，以及自動化項目的OffScreen版本。CefSharp基于Chromium Embedded Framework，這是Google Chrome的開源版本。
實際項目應用效果如下：
Miniblink是一個追求極致小巧的瀏覽器內核項目，全世界第三大流行的瀏覽器內核控件。其基于chromium最新版內核，去除了chromium所有多余的部件，只保留最基本的排版引擎blink。Miniblink保持了10M左右的極簡大小，是所有同類產品最小的體積，同時支持windows xp、npapi。
GeckoFX是skybound工作室開發的一個開源的用于方便將gecko引擎（最主要的瀏覽器是firefox）鏈接到.net 窗體應用的一個組件。它是用C#寫成的，里面有大量的C#的注釋，geckofx是最完美的默認的iE核心webbrowse控件的替代控件。
DotNetBrowser能嵌入一個基于Chromium的WPF或WinForms組件到你的.NET應用中，用來顯示使用HTML5、CSS3、JavaScript、Silverlight等技術構建的現代網頁。
Microsoft Edge WebView2 控件允許在本機應用中嵌入 web 技術(HTML、CSS 以及 JavaScript)。 WebView2 控件使用 Microsoft Edge(Chromium) 作為繪制引擎，以在本機應用中顯示 web 內容。 使用 WebView2，可以在本機應用的不同部分嵌入 Web 代碼，或在單個 WebView 實例中生成所有本機應用。
所以在客戶端程序中嵌入網頁程序，首選CefSharp。
歡迎關注、點贊、評論、轉發，每天都能獲取IT優質內容。
#人民網評錢楓被指性侵#
網頁中添加視頻、聲音、動畫等，可以增強用戶體驗。在HTML5之前，為網頁添加多媒體的唯一辦法，就是使用第三方的插件（如，Adobe Flash等）。
HTML5中，提供了對多媒體的原生支持，只需通過 video 元素，就可以向網頁嵌入視頻、電影或音頻資源，通過 audio 元素向網頁嵌入音頻資源，省時省力。
HTML中嵌入視頻和音頻代碼
在HTML5時代，在網頁中嵌入視頻非常簡單，只需要一個 video 元素，并設置它的 src 屬性，使其鏈接一個視頻地址就可以完全搞定了，這個太esay了
<video src="media/vedio.mp4"></video>
把這個網站在IE8中打開一看，網站上除了一片空白外，什么也沒有，這是為什么呢？
原來 video 是HTML5最新引入的元素，并不是所有瀏覽器都支持它，IE8及以下版本都無法識別 video 標簽。如果瀏覽器不識別 video標簽，則會忽略它，當做什么都沒有。這就是網站上一片空白的原因。
這個問題好解決，只需在 video 標簽之間放置文本信息，不支持 video 標簽的老瀏覽器，會顯示 video 標簽之間的文本信息，以提示用戶瀏覽器不支持 video，就這么簡單！
<video src="media/vedio.mp4">
你的瀏覽器已經老掉牙了，不支持video，還不趕快使用現代瀏覽器O(∩_∩)O~！
</video>
在IE8上打開一看，確實顯示了提示文本，這下好多了，至少用戶知道自己的瀏覽器不能播放視頻，該換瀏覽器了。
下載了Opera瀏覽器的最新版本25.0，打開一看，怎么還是一片空白外！Opera瀏覽器明明是支持video標簽的，那又是為什么呢？
這個就得從視頻的編碼格式說起了。video 元素支持三種視頻格式：Ogg、MP4、WebM。
Ogg是帶有Theora視頻編碼和Vorbis音頻編碼的文件，后綴名為 .ogg；MP4是帶有H.264視頻編碼和AAC音頻編碼的MP4文件，后綴名為 .mp4；WebM是VP8視頻編碼和Vorbis音頻編碼的文件，后綴名為 .webm。
這個Opera瀏覽器呢，它可以支持ogg，但不支持mp4。由于Opera支持video標簽，故video標簽之間的文本信息沒有顯示出來，但它不支持ogg，所以就不進行播放，最終導致頁面出現一片空白。這下可怎么辦呢？
其實辦法有的是，我們可以從網上下載一副圖像，放到視頻播放窗口，如果視頻無法播放，就顯示這張圖片，是不是更好呢？從網上下載一張美女圖片，干脆叫beauty.jpg吧。那這個圖像怎么添加到視頻窗口呢？
video標簽有個poster 屬性，就是專門在視頻窗口放置圖片的。poster是一個video的占位符，無論什么情況下，只要視頻還沒有播放（視頻下載過程中、視頻不存在、不支持該視頻類型、用戶點擊播放按鈕前），就會顯示該圖像，可以看做是視頻播放之前插入的宣傳畫或海報。
<video src="media/vedio.mp4" poster = "img/beauty.jpg">
你的瀏覽器已經老掉牙了，不支持video，還不趕快使用現代瀏覽器O(∩_∩)O~！
</video>
在Opera瀏覽器上刷新一下，真的有一個美女沖著自己微笑呢。雖然視頻沒有播放出來，這回心情卻是好多了。
那我可不能一天到晚只看美女呀，視頻還是還是要想辦法播放出來的。既然Opera瀏覽器不支持mp4，我們就換成需要ogg吧，這樣就肯定沒問題了。
我想了想，這個辦法不好，萬一某個瀏覽器只支持支持ogg，不支持mp4呢。這年頭，什么都缺，就是不缺點子，隨便在網上一搜，辦法就有了。
在 video 元素中添加 source 元素，就可以解決這個問題。在source 元素中，通過 src 屬性指定視頻的地址，通過 type 屬性指定視頻的類型，以幫助瀏覽器決定是否能播放該視頻。并且，在 video 元素中可以添加任意多個source 元素，讓不同的 source 元素鏈接到不同的視頻文件。
這樣的話，當瀏覽器發現 video 元素時，首先會查看它本身是否定義了 src 屬性。如果沒有，就會檢查 source 元素。瀏覽器會逐個查看這些視頻源，直到找到一個可以播放的視頻。一旦找到，就會播放它并忽略其他的視頻源。我們干脆添加兩個source，一個是mp4，一個是ogg，這下視頻是一定能播放出來了。
<video poster = "img/beauty.jpg">
<source src="media/vedio.mp4" type="video/mp4">
<source src="media/vedio.ogg" type="video/ogg">
你的瀏覽器已經老掉牙了，不支持video，還不趕快使用現代瀏覽器O(∩_∩)O~！
</video>
在Opera瀏覽器上又刷新一下，只有美女沖著我微笑，視頻還是沒播放出來。唉，太粗心了，忘記添加播放視頻的控件了。
在video標簽中，通過添加controls 屬性來為視頻添加播放控件，方便用戶執行播放、暫停操作和音量控制。
<video poster = "img/beauty.jpg" controls>
（此處略去500字…）
</video>
在Opera瀏覽器上又刷新一下，效果真的不一樣，這次不僅看到美女，還看到了視頻控件。用鼠標猛戳一下那個播放按鈕，哈哈，不錯，真的聽到美妙的旋律。我們的ogg文件，終于播放出來了，讓我們好好享受一下吧O(∩_∩)O。
聽了一會，忽然一想，不對呀，我剛才點了播放按鈕后，等了半天才聽到聲音。能不能我一點播放按鈕，就立即播放呢？
原來視頻也是需要下載緩存的，點擊播放按鈕后，首先緩存，然后才播放的。那能不能在頁面加載的同時就緩存呢。這樣，用戶點擊播放后，就不必等待了。
這當然可以，在video標簽中，通過添加preload屬性來為視頻添加預加載功能，在頁面加載的同時加載視頻。
<video poster = "img/beauty.jpg" controls preload>
（此處略去500字…）
</video>
關于 preload 屬性，稍微再啰嗦一點，就是可以把它設置為 metadata，讓瀏覽器僅僅預加載視頻的基本信息，如尺寸、時長、以及一些關鍵的幀。這樣的話，在開始播放之前，瀏覽器可以提前計算視頻的顯示尺寸。
既然一切都OK了！讓我們看看mp4是不是能正常播放。下載最新版的Google Chrome 38.0瀏覽器，打開網頁，猛戳一下播放按鈕。
等等~，等等~，不對，怎么只有聲音沒有畫面，明明是mp4格式的文件呀？使用暴風影音試了一下，是有畫面的呀！
辛辛苦苦又在網上搜了一番，花了整整586秒，終于找到了答案。mp4視頻需要h.264編碼格式才會有圖像的。
找了一個 h.264 編碼格式的 mp4 試了一下，不錯，確實有圖像了！看了半天，原來是一部老外的電影，嘰里咕嚕一陣，一句話也沒聽懂。那O(∩_∩)O~，能否提供中文字幕呢，這樣就不必費老大勁去聽了！
HTML5中，通過在video元素添加track元素為視頻添加字幕。字幕文件有兩種格式：WebVTT和TTML。WebVTT是Web視頻文本軌跡（Web Video Text Track），是UTF-8編碼格式的文本文件；TTML是時序文本標記語言（Timed Text Markup Language），是XML格式的文件。兩種文件的具體格式，已經超出我們的討論范圍。
video元素支持添加多個track元素，不同的track元素鏈接到不同的字幕文件。用戶可以在各個字幕間進行切換。
<video poster = "img/beauty.jpg" controls preload>
<track src="en_track.vtt" kind="subtitles" srclang="en" label="English" default>
<track src="cn_track.vtt" kind="captions" srclang="zh" label="簡體中文">
</video>
track元素中，src屬性指定字幕文件的URL；srclang屬性字幕文件的語言類型，若kind 屬性值是 "subtitles" 時，該屬性必需的；label 屬性指定字幕標簽，每個字幕元素必需設置一個唯一不重復的標簽，切換字幕時，會顯示標簽的名稱；kind指定字幕內容類型，只能是subtitles、captions、descriptions、chapters、metadata 之一；default屬性指定是否是默認字幕，如果一個都沒指定，將不會自動顯示字幕。
除了字幕外，我還希望對視頻進行過多的控制，比如讓視頻自動播放、循環播放、默認靜音，以及視頻窗口的尺寸等等，這些都能做到嗎？
這已經不是什么事了，video 元素已經提供了相關屬性，根據需要設置相應的屬性就可以了。這些屬性及含義見表 23：
HTML中嵌入視頻和音頻代碼
哦，原來這么簡單呀！那就到此為止吧，網頁中嵌入視頻的全部代碼都在這里，就打包給你吧！
<video width="300" poster="img/beauty.jpg" controls preload autoplay loop muted>
<source src="media/vedio.mp4">
<source src="media/vedio.ogg">
<track src="en_track.vtt" kind="subtitles" srclang="en" label="English" default>
<track src="cn_track.vtt" kind="captions" srclang="zh" label="簡體中文">
你的瀏覽器已經老掉牙了，不支持video，還不趕快使用現代瀏覽器O(∩_∩)O~！
</video>
睜大眼睛一看，卻只有7行代碼。然而，就這區區7行代碼，可把他折磨得夠嗆。
看著這一切都全部搞定，他仰望著天空，長長呼了一口氣，顯得是那么的放松，那么的愜意。此時，他閉上眼睛，在自己的夢幻世界里遨游！
有了在網頁中嵌入視頻的經歷，要在網頁中嵌入音頻，那簡直就是小菜一碟了。只要把vedio元素換成 audio 元素，就全部搞定。
但需要了解的是，audio 所支持的音頻格式只有Ogg Vorbis、mp3 和 wav。還要知道，由于音頻沒有畫面，也就沒有 width、height、poster 屬性，而其他屬性都支持，并且跟視頻的含義相同。
網頁中嵌入音頻的代碼如下：
<audio controls preload autoplay loop muted>
<source src="media/audio.mp3">
<source src="media/audio.wav">
<source src="media/audio.ogg">
你的瀏覽器已經老掉牙了，不支持audio，還不趕快使用現代瀏覽器O(∩_∩)O~！
</audio>
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
