整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
分享成果，隨喜正能量】時間即是生命，爭取時間，就是搶救生命；壽命就是時間，浪費(fèi)時間，就是糟蹋生命。
《VBA信息獲取與處理》教程是我推出第六套教程，目前已經(jīng)是第一版修訂了。這套教程定位于最高級，是學(xué)完初級，中級后的教程。這部教程給大家講解的內(nèi)容有：跨應(yīng)用程序信息獲得、隨機(jī)信息的利用、電子郵件的發(fā)送、VBA互聯(lián)網(wǎng)數(shù)據(jù)抓取、VBA延時操作，剪貼板應(yīng)用、Split函數(shù)擴(kuò)展、工作表信息與其他應(yīng)用交互，F(xiàn)SO對象的利用、工作表及文件夾信息的獲取、圖形信息的獲取以及定制工作表信息函數(shù)等等內(nèi)容。程序文件通過32位和64位兩種OFFICE系統(tǒng)測試。是非常抽象的，更具研究的價值。
教程共兩冊，八十四講。今日的內(nèi)容是專題八“VBA與HTML文檔”的第二節(jié)上半部分：HTML文檔常用元素的構(gòu)成
大家好，我們今日繼續(xù)講解HTML文檔的元素分析第二部分，對于HTML文檔的元素，我們只要求大家能看懂，對于一些常見的元素熟悉即可，畢竟我們側(cè)重于應(yīng)用。不是構(gòu)建網(wǎng)站。
1）圖像 <img>
通過使用 HTML，可以在文檔中顯示圖像。圖像標(biāo)簽用法和超鏈接類似，圖像標(biāo)簽（<img>）和源屬性（Src）
語法：<img src=”url” alt=”文本”>
<img> 是空標(biāo)簽，意思是說，它只包含屬性，并且沒有閉合標(biāo)簽。要在頁面上顯示圖像，你需要使用源屬性（src）。src 指 "source"。源屬性的值是圖像的 URL 地址。
alt屬性代表的是，當(dāng)圖片無法加載的時候，替換顯示的文本。我們?nèi)耘f以一個例子來說明：
將“HTML基礎(chǔ)學(xué)習(xí)-2.html”的文件修正如下：
<html>
<head> <!--注釋：文檔頭部，文檔相關(guān)消息，并不提供文檔內(nèi)容-->
<title>
VBA應(yīng)用提高篇，圖像的測試
</title>
</head>
<body> <!--注釋：文檔主體-->
<h1>圖像的測試</h1>
<p>這里我將測試一個圖片：</p>
<img src="http://p3.toutiaoimg.com/large/pgc-image/9fbe77be8a784b9abefdca070a9e4503" img_width="542" img_height="406"
alt="使用WithEvents定義響應(yīng)事件的對象" inline="0">
</body>
</html>
內(nèi)容截圖：
上述代碼中
<img src="http://p3.toutiaoimg.com/large/pgc-image/9fbe77be8a784b9abefdca070a9e4503" img_width="542" img_height="406" alt="使用WithEvents定義響應(yīng)事件的對象" inline="0">
就是對圖像的引用：http://p3.toutiaoimg.com/large/pgcimage/9fbe77be8a784b9abefdca070a9e4503 是圖像的地址。我們將上述文件保存為“HTML基礎(chǔ)學(xué)習(xí)-3.html”，然后用雙擊打開，我們可以看到下面的網(wǎng)頁效果：
2）表格<table>
表格由 <table> 標(biāo)簽來定義。每個表格均有若干行（由 <tr> 標(biāo)簽定義），每行被分割為若干單元格（由 <td> 標(biāo)簽定義）。字母 td 指表格數(shù)據(jù)（table data），即數(shù)據(jù)單元格的內(nèi)容。數(shù)據(jù)單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。表格的表頭使用 <th> 標(biāo)簽進(jìn)行定義。
大多數(shù)瀏覽器會把表頭顯示為粗體居中的文本：
表格是我們網(wǎng)頁最常見的，也是我們網(wǎng)頁數(shù)據(jù)提取，最需要打交道的，它非常簡單，如果不定義邊框?qū)傩裕砀駥⒉伙@示邊框。有時這很有用，但是大多數(shù)時候，我們希望顯示邊框。
使用邊框?qū)傩詠盹@示一個帶有邊框的表格：
<html>
<head> <!--注釋：文檔頭部，文檔相關(guān)消息，并不提供文檔內(nèi)容-->
<title>
表格的測試
</title>
</head>
<body> <!--注釋：文檔主體-->
<h1>表格的測試</h1>
<p>這里我將測試兩個表格：</p>
<table border="1"> <!--注釋：border設(shè)置表格邊框樣式-->
<caption>VBA學(xué)習(xí)資料</caption>
<tr>
<th>難易</th>
<th>資料</th>
</tr>
<tr>
<td>初級教程</td>
<td> VBA代碼解決方案</td>
</tr>
<tr>
<td>中級教程</td>
<td>VBA數(shù)組與字典解決方案</td>
</tr>
</table>
</body>
</html>
上述文件保存為“HTML基礎(chǔ)學(xué)習(xí)-4.html” ,打開后效果如下：
3) 輸入標(biāo)簽 <input>
除了表格，表單也是我們在網(wǎng)頁數(shù)據(jù)提取，頁面操控最常見到的元素。例如我們注冊用戶，例如我們的微博登陸，例如我們的百度搜索，其實(shí)都是表單。表單會讓輸入一些信息。輸入標(biāo)簽 <input>就是用來輸入信息的。
其語法是：<input type=類型 name=元素名稱 id=元素id value=元素值/>
其類型由type屬性定義，常見的有：text（文本框）、Radio（單選按鈕）、Checkboxes（復(fù)選框）、submit（提交按鈕）、hidden（隱藏）、reset（重置）和password（密碼框）等。
其中注意，其中單選框和復(fù)選框的是否選中，由checked屬性指定，如果值是”checked”則選定。
4）框架<frame> 標(biāo)簽
Frame 標(biāo)簽定義了放置在每個框架中的 HTML 文檔。
Frame是獨(dú)立框架，就好像我們的分屏瀏覽一樣，一個屏幕，瀏覽多個畫面一樣。框架必須放置在框架結(jié)構(gòu)標(biāo)簽里面（<frameset>），其rows/columns 屬性的值規(guī)定了框架每行或每列占據(jù)屏幕的面積。另外，frameset和body不能同時使用，除非有noframes，很簡單，因?yàn)閒rame其實(shí)就描繪文檔了，所以，一般不需要再有body進(jìn)行描繪。另外，框架元素一般放置于head元素內(nèi)。Frame元素的src屬性就是設(shè)定了其框架內(nèi)顯示頁面的URL。
5）<iframe> 標(biāo)簽
Iframe的框架，就類似畫中畫的效果，在原頁面插入一個頁面。語法如下：
<iframe src =url scrolling=yes/no/auto height=xx width=xx>
Src設(shè)定框架內(nèi)要顯示的文檔的url，scrolling設(shè)置是否顯示滾動條。Height和widty設(shè)置的就是它的高度和寬度。
關(guān)于HTML文檔的元素，還有一些沒有講到，大家可以參考一些專門的資料，如萬維網(wǎng)的講解，我這里就不再過多的介紹了。
1）圖像 <img>
2）表格<table>
3) 輸入標(biāo)簽 <input>
4）框架<frame> 標(biāo)簽
5）<iframe> 標(biāo)簽
以上各個元素我們要盡可能的理解掌握，才能在分析網(wǎng)頁的時候可以隨心所欲。下一講我們繼續(xù)講解HTML網(wǎng)頁的元素的屬性。
本節(jié)知識點(diǎn)回向：
說出以下個元素的標(biāo)簽的作用：1）圖像 <img> 2）表格<table> 3) 輸入標(biāo)簽 <input>
4）框架<frame> 標(biāo)簽 5）<iframe> 標(biāo)簽。
本節(jié)參考文件：HTML基礎(chǔ)學(xué)習(xí)-3.html；HTML基礎(chǔ)學(xué)習(xí)-4.html
我20多年的VBA實(shí)踐經(jīng)驗(yàn)，全部濃縮在下面的各個教程中，教程學(xué)習(xí)順序：
【分享成果，隨喜正能量】在問題出現(xiàn)的那瞬間，一定要控制好情緒，不要發(fā)火，不要偏激，不要說什么過激的話，懂得忍耐。忍耐不是為了讓你不去處理這件事，而是為了避免在情緒失控的情況下，干出什么讓自己丟臉的事情。以后你就會知道，生活中真的沒有幾件事情是值得我們搭上禮貌，教養(yǎng)，人品和格局的。
現(xiàn)在用戶面前的WEB頁面，內(nèi)容無非就是文字、圖片、視頻、音頻這四大方面。而這些內(nèi)容要呈現(xiàn)在用戶眼前，最最基礎(chǔ)的一種互聯(lián)網(wǎng)語言，就是HTML（HyperText Markup Language）標(biāo)記語言。所有千變?nèi)f化、眼花繚亂、酷炫精彩的內(nèi)容，都離不開HTML標(biāo)簽的汗馬功勞。下面小白就總結(jié)一下自學(xué)后的一些基礎(chǔ)的HTML知識點(diǎn)。
HTML中的標(biāo)簽元素一般分為三大類，它們分別是：塊級元素、行內(nèi)元素、行內(nèi)塊級元素。下面總結(jié)一下這幾類元素的特點(diǎn)及應(yīng)用。
01 塊級元素
特點(diǎn)：
① 獨(dú)占一行、從上到下排列
② 可直接控制寬度、高度及盒子模型的CSS屬性（width 、height、padding 等屬性值）
③ 在不單獨(dú)設(shè)置寬度的情況下，塊級元素的寬度（width屬性）繼承父元素
④ 在不單獨(dú)設(shè)置高度的情況下，塊級元素的高度（height屬性）靠自己的基因（它本身內(nèi)容的高度）
塊級元素從我的理解來說，就是一個大框框，用來框住其它元素不要亂跑亂竄的，只能在一定范圍內(nèi)活動。所以，它通常會用來進(jìn)來大的結(jié)構(gòu)搭建。
常用的塊級元素：
標(biāo)題類 | <h1></h1> | <h2></h2> |
<h3></h3> | <h4></h4> | |
<h5></h5> | <h6></h6> | |
列表類 | <ol></ol> | <ul></ul> |
<li></li> | <dl></dl> | |
<dt></dt> | <dd></dd> | |
普通類 | <div></div> | <p></p> |
</hr> | <center></center> | |
<pre></pre> | ||
表格類 | <table></table> | |
表單類 | <form></form> |
02 行內(nèi)元素
特點(diǎn)：
① 元素與元素之間會自動排列成一行，遇到空間不夠自動換行
② 默認(rèn)高度和寬度（width、height）屬性與它們的內(nèi)容有關(guān)，無內(nèi)容那么它本身也就是虛無。
③ 行內(nèi)元素不支持padding、margin的上下調(diào)動（它們就是緊挨著不離不棄、除非用外部手部強(qiáng)制拆散它們）
行內(nèi)元素一般用來修飾點(diǎn)綴內(nèi)容而用，語義化比較強(qiáng)，用來加強(qiáng)代碼的可讀性。
常用的行內(nèi)元素：
<a></a> | <b></b> | <br></br> |
<span></span> | <strong></strong> | |
<i></i> | <em> </em> | <sub> </sub> |
<sup> </sup> |
03 行內(nèi)塊元素
特點(diǎn)：
從這個名字就可以看出來，它是一個結(jié)合體，塊級元素和行內(nèi)元素的結(jié)合體。它具備二者共有的一些特點(diǎn)，使用非常頻繁。
① 元素具有塊級元素的屬性（width、height等屬性），可以對其直接控制
② 雖然有寬和高，但是他并不會霸道地獨(dú)占一行，它具有行內(nèi)元素的“親情屬性”，會自動排列挨在一起。
③ 行內(nèi)塊元素支持padding、margin的上下調(diào)動
<img> </img> | <input /> | <select> </select> |
<textarea> </textarea> | <label> </label> | <button> </button> |
歡迎大佬提點(diǎn)指正
TML 文檔由 HTML 元素定義。
HTML 元素
<phtml 元素指的是從開始標(biāo)簽（start="" tag）到結(jié)束標(biāo)簽（end="" tag）的所有代碼。<="" p="" style="color: rgb(51, 51, 51); font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, STHeiti, 'Microsoft Yahei', sans-serif; font-size: 12px; line-height: normal; white-space: normal;">
| 開始標(biāo)簽 * | 元素內(nèi)容 | 結(jié)束標(biāo)簽 * |
|---|---|---|
| <p> | 這是一個段落 | </p> |
| <a href="default.htm"> | 這是一個鏈接 | </a> |
| <br> |
*開始標(biāo)簽常被稱為起始標(biāo)簽（opening tag），結(jié)束標(biāo)簽常稱為閉合標(biāo)簽（closing tag）。
HTML 元素語法
HTML 元素以開始標(biāo)簽起始
HTML 元素以結(jié)束標(biāo)簽終止
元素的內(nèi)容是開始標(biāo)簽與結(jié)束標(biāo)簽之間的內(nèi)容
某些 HTML 元素具有空內(nèi)容（empty content）
空元素在開始標(biāo)簽中進(jìn)行關(guān)閉（以開始標(biāo)簽的結(jié)束而結(jié)束）
大多數(shù) HTML 元素可擁有屬性
注釋: 您將在本教程的下一章中學(xué)習(xí)更多有關(guān)屬性的內(nèi)容。
嵌套的 HTML 元素
<p大多數(shù) html="" 元素可以嵌套（可以包含其他="" 元素）。<="" p="">
HTML 文檔由嵌套的 HTML 元素構(gòu)成。
HTML 文檔實(shí)例
<!DOCTYPE html>
<html>
<body>
<p>這是第一個段落。</p>
</body>
</html>
以上實(shí)例包含了三個 HTML 元素。
HTML 實(shí)例解析
<p> 元素:
<p>這是第一個段落。</p>
這個 <p> 元素定義了 HTML 文檔中的一個段落。
這個元素?fù)碛幸粋€開始標(biāo)簽 <p> 以及一個結(jié)束標(biāo)簽 </p>.
元素內(nèi)容是: This is my first paragraph.
<body> 元素:
<body>
<p>這是第一個段落。</p>
</body>
The <body> 元素定義了 HTML 文檔的主體。
這個元素?fù)碛幸粋€開始標(biāo)簽 <body> 以及一個結(jié)束標(biāo)簽 </body>。
元素內(nèi)容是另一個 HTML 元素（p 元素）。
<html> 元素：
<html>
<body>
<p>這是第一個段落。</p>
</body>
</html>
The <html> 元素定義了整個 HTML 文檔。
這個元素?fù)碛幸粋€開始標(biāo)簽 <html> ，以及一個結(jié)束標(biāo)簽 </html>.
元素內(nèi)容是另一個 HTML 元素（body 元素）。
不要忘記結(jié)束標(biāo)簽
即使您忘記了使用結(jié)束標(biāo)簽，大多數(shù)瀏覽器也會正確地顯示 HTML：
<p>這是一個段落
<p>這是一個段落
以上實(shí)例在瀏覽器中也能正常顯示，因?yàn)殛P(guān)閉標(biāo)簽是可選的。
但不要依賴這種做法。忘記使用結(jié)束標(biāo)簽會產(chǎn)生不可預(yù)料的結(jié)果或錯誤。
HTML 空元素
沒有內(nèi)容的 HTML 元素被稱為空元素。空元素是在開始標(biāo)簽中關(guān)閉的。
<br> 就是沒有關(guān)閉標(biāo)簽的空元素（<br> 標(biāo)簽定義換行）。
在 XHTML、XML 以及未來版本的 HTML 中，所有元素都必須被關(guān)閉。
在開始標(biāo)簽中添加斜杠，比如 <br />，是關(guān)閉空元素的正確方法，HTML、XHTML 和 XML 都接受這種方式。
即使 <br> 在所有瀏覽器中都是有效的，但使用 <br /> 其實(shí)是更長遠(yuǎn)的保障。
HTML 提示：使用小寫標(biāo)簽
HTML 標(biāo)簽對大小寫不敏感：<P> 等同于 <p>。許多網(wǎng)站都使用大寫的 HTML 標(biāo)簽。
W3CSchool 使用的是小寫標(biāo)簽，因?yàn)槿f維網(wǎng)聯(lián)盟（W3C）在 HTML 4 中推薦使用小寫，而在未來 (X)HTML 版本中強(qiáng)制使用小寫。
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
