整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
在HTML中,存在這許許多多的元素(同:”HTML標簽”),這些元素最終可分為三類,分別是塊級元素,內聯元素(同:”行內元素”),塊級內聯元素(同:”行內塊元素”)。
你對這些元素是否真的了解呢?
我們來看看這三類元素的特點:
一.特點
1.每個塊級元素都從新的一行開始顯示(塊級元素獨占一行)
2.元素的寬度,高度,內邊距(padding),邊框(border),外邊框(margin)都能隨意設置
3.塊級元素在網頁中所占面積=內容區(content)+內邊距(padding)+邊框(border)+外邊距(margin)
4.塊級元素本身未設置寬度的情況下,寬度=父元素寬度-該元素的左右外邊距-該元素的左右邊框-該元素的左右內邊距
5.塊級元素未設置padding和border的情況下,padding和border的數值為0
6.塊級元素未設置寬度和外邊距的情況下,margin的值為0,寬度為100%(即與父元素寬度一致)
7.塊級元素設置寬度但未設置外邊距的情況下,左外邊距的值為0
8.塊級元素設置寬度,未設置padding和border,同時設置margin: 0 auto的情況下,左右外邊距平分 父元素寬度-該元素寬度所剩余的空間
9.塊級內聯元素不受父元素的line-height以及自身的vertical-align影響
二.將非塊級元素轉換成塊級元素的方法
1.display:block
2.float:left或right
3.position:absolute或fixed
4.父元素使用display:flex,子元素會變為塊級元素
三.常見塊級元素
<div>,<p>,<h1>...<h6>,<ol>,<ul>,<dl>,<address>,<blockquote> ,<form>
一.特點
1.當父元素寬度足以放下多個內聯元素時,一行內可以顯示多個內聯元素,否則放不下的內聯元素將另起一行(一行存放多個內聯元素)
2.內聯元素的寬度,高度由該元素的內容撐開
3.內聯元素的寬度/高度/padding-top/border-top/margin-top/margin-bottom設置無效
4.如果padding/border/margin未設置的情況下,全部為0
5.內聯元素受父元素的line-height以及自身的vertical-align影響
二.將非內聯元素轉換成內聯元素的方法
使用display:inline
三.常見內聯元素
<a>,<span>,<i>,<br>,<strong>,<em>
一.特點
1.當父元素寬度足以放下多個塊級內聯元素時,一行內可以顯示多個塊級內聯元素,否則放不下的塊級內聯元素將另起一行(一行存放多個塊級內聯元素)
2.塊級內聯元素的寬度,高度,內邊距(padding),邊框(border),外邊框(margin)都能隨意設置
3. 塊級內聯元素的寬度,高度未設置的情況下,由該元素的內容撐開
4.塊級內聯元素受父元素的line-height以及自身的vertical-align影響
二.將非內聯元素轉換成內聯元素的方法
使用display:inline-block
三.常見內聯元素
<input>
web前端之二叉搜索樹
分享成果，隨喜正能量】人可以無知，但不可以無趣。在自己的心上種一顆快樂的種子，堅定、快樂的做自己的事，更讓大家不那么無趣。
《VBA信息獲取與處理》教程是我推出第六套教程，目前已經是第一版修訂了。這套教程定位于最高級，是學完初級，中級后的教程。這部教程給大家講解的內容有：跨應用程序信息獲得、隨機信息的利用、電子郵件的發送、VBA互聯網數據抓取、VBA延時操作，剪貼板應用、Split函數擴展、工作表信息與其他應用交互，FSO對象的利用、工作表及文件夾信息的獲取、圖形信息的獲取以及定制工作表信息函數等等內容。程序文件通過32位和64位兩種OFFICE系統測試。是非常抽象的，更具研究的價值。
教程共兩冊，八十四講。今日的內容是專題八“VBA與HTML文檔”的第二節上半部分：HTML文檔常用元素匯總
3）HTML 注釋 <!-- 與 -->
注釋標簽 <!-- 與 --> 用于在 HTML 插入注釋。可以將注釋插入 HTML 代碼中，這樣可以提高其可讀性，使代碼更易被人理解。瀏覽器會忽略注釋，也不會顯示它們。開始括號之后（左邊的括號）需要緊跟一個嘆號，結束括號之前（右邊的括號）不需要。
注釋可以按下面的格式寫：
<!--注釋：文檔頭部，文檔相關消息，并不提供文檔內容-->
4）段落 <p>
段落是通過 <p> 標簽定義的。瀏覽器會自動地在段落的前后添加空行。（<p> 是塊級元素）
在上面的例子中我們已經用到了表述段落的符號<p>，我們如果提取網頁小說的數據，新聞等頁面的消息，文本都是一段一段的，這樣的頁面，我們就可以通過<p>標簽實現。當運用ie/webbrowser方式提取這類網頁的時候，歷遍所有段落p元素即可。
使用空的段落標記 <p></p> 去插入一個空行是個壞習慣。可以用 <br /> 標簽代替它！（但是不要用 <br /> 標簽去創建列表。）
5）超鏈接 <a>
使用 <a> 標簽在 HTML 中創建鏈接。
超鏈接可以是一個字，一個詞，或者一組詞，也可以是一幅圖像，您可以點擊這些內容來跳轉到新的文檔或者當前文檔中的某個部分。當您把鼠標指針移動到網頁中的某個鏈接上時，箭頭會變為一只小手。
有兩種使用 <a> 標簽的方式：通過使用 href 屬性 - 創建指向另一個文檔的鏈接也可以通過使用 name 屬性 - 創建文檔內的書簽。
超鏈接是我們最常見的頁面元素，基本的門戶網站都有他，點了以后，可以跳轉到另一個頁面。一般語法格式：
<a href=”跳轉的URL” target=” _blank/_self”>顯示的超鏈接文本</a>
Target屬性，表示的是當我們點擊超鏈接，是在原頁面進行跳轉（_self）還是新建頁面進行跳轉（_blank）。
為了說明這種超鏈接，我們更正一下“HTML基礎學習-1.html”的內容：
<html>
<head> <!--注釋：文檔頭部，文檔相關消息，并不提供文檔內容-->
<title>
VBA應用提高篇
</title>
</head>
<body> <!--注釋：文檔主體-->
<h1>學習VBA語言</h1>
<p>為了更好的掌握VBA的各個知識點，您可以先參考我的第一套教程：VBA代碼解決方案</p>
<a href="https://mbd.baidu.com/newspage/data/landingshare?pageType=1&isBdboxFrom=1&context=%7B%22nid%22%3A%22news_9520815886500285610%22%2C%22sourceFrom%22%3A%22bjh%22%7D" target=" _blank">顯示學習的網頁</a>
</body>
</html>
講上述代碼另存為“HTML基礎學習-2.html”內容截圖：
打開這個文件：
點擊鏈接：
查看一下源碼：
1）標題 <h1> - <h6>
2）水平線 <hr />
3）注釋 <!-- 與 -->
4）段落 <p>
5）超鏈接 <a>
以上各個元素我們要熟練的掌握，才能在分析網頁的時候可以隨心所欲。下一講我們繼續講解HTML網頁的元素構成。
本節知識點回向：
什么是HTML文檔的框架結構是怎樣的？說出以下個元素的標簽：標題，水平線，注釋，段落，超鏈接 。
本節參考文件：HTML基礎學習-1.html；HTML基礎學習-2.html
我20多年的VBA實踐經驗，全部濃縮在下面的各個教程中，教程學習順序：
【分享成果，隨喜正能量】人生在世，會遇到一些好事，還會遇上些壞事。好事我承受得起，壞事也承受得住。就這樣坦蕩蕩做個尋常人也不壞。
tml元素主要分為3類，塊級元素、內聯元素以及內聯塊級元素，本篇文章我們來就詳細介紹一下各個分類的含義以及對應的特點。
在html中div、 p、hx、form、ul 、 li、dl、dd就是塊級元素。css屬性設置display:block就是將元素顯示為塊級元素。塊級元素特點：
1、每個塊級元素都從新的一行開始，并且其后的元素也另起一行；（一個塊級元素獨占一行）
2、元素的高度、寬度、行高以及頂和底邊距都可設置；
3、元素寬度在不設置的情況下，是它本身父容器的100%（和父元素的寬度一致），除非設定一個寬度。
我們這里將塊級元素代碼寫一下然后看一下在瀏覽器中的顯示效果。html代碼就如下所示：
在網頁中我們可以看到，這些元素每一個都單獨占據一行的空間，不管內容是否夠一行。
在html中，span、a、label、input、 strong 和em就是典型的內聯元素（行內元素）（inline）元素。當然塊狀元素也可 以通過代碼display:inline將元素設置為內聯元素。內聯元素特點：
1、和其他元素都在一行上；
2、元素的高度、寬度、行高及頂部和底部邊距不可設置；
3、元素的寬度就是它包含的文字或圖片的寬度，不可改變。
注意：為 a 元素設置了寬和高，但都沒有起到作用，原因是a在默認的時候是內聯元素，內聯元素是不可以設置寬和高的。
我們這里將內聯元素代碼寫一下然后看一下在瀏覽器中的顯示效果。html代碼就如下所示：
在網頁中我們可以看到，這些元素會在一行一直排著顯示，直到充滿整行空間才會換行顯示。
內聯塊狀元素（inline-block）就是同時具備內聯元素、塊狀元素的特點，代碼display:inline-block就是將元素設置為內聯塊狀元素。inline-block元素特點：
1、和其他元素都在一行上；
2、元素的高度、寬度、行高以及頂和底邊距都可設置。
注意：img是inline元素，但是他同時也是替換元素，他有著特殊的表現：
1. 可以設置width/height;
2. 默認的，img元素在屏幕占據的空間與其圖片的實際像素一致，除非CSS有設置或者自身的width/height HTML 屬性有設置；
3. 如果img標簽的包裹元素為也為inline元素，則img的邊界可以超出其直接父元素的邊界，直到自己的寬、高達到最大或者設定值為止，而且文檔流中img的兄弟元素也不能遮蓋住img。最常見的就是a里面包含的img；
4. 所以從行為上看,img元素作為替換元素，有著類似于Inline-block的行為，盡管在SPEC里面，他的確是一個inline元素。
對于html的元素分類今天就先介紹到這里，大家在平時可以自己多加練習練習，做到每個標簽屬于什么元素。
每日金句： 成功的秘訣就是每天都比別人多努力一點。喜歡我的文章的小伙伴記得關注一下哦，每天將為你更新最新知識。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
