高级文本格式
HTML中還有許多用于格式化文本的元素,我們在HTML文本基礎文章。本文中描述的元素不那么為人所知,但是了解這些元素仍然很有用(而且這仍然不是一個完整的列表)。在這里,您將學習如何標記引文、描述列表、計算機代碼和其他相關文本、下標和上標、聯系信息等。
先決條件:
基本的HTML熟悉性,如開始使用HTML。HTML文本格式,如HTML文本基礎.
目標:
學習如何使用不太知名的HTML元素來標記高級語義特性。
描述列表
在HTML文本基礎知識中,我們介紹了如何標記基本列表在HTML中,但是我們沒有提到第三種類型的列表-描述列表。這些列表的目的是標記一組項目及其相關描述,如術語和定義,或問答。讓我們看一組術語和定義的示例:
自言自語的戲劇中,一個角色對自己說話,表達他們內心的想法或感受,并在這個過程中將他們傳達給觀眾(但不是其他角色)。話劇中的獨白,劇中一個角色大聲地說出他們的想法,與在場的觀眾和任何其他角色分享他們的想法。在戲劇中,一個角色只為了幽默或戲劇效果而與觀眾分享評論。這通常是一種感覺、想法或其他背景信息。
描述列表使用與其他列表類型不同的包裝器-
請注意,允許具有多個描述的單個術語,例如:
撇開主動學習:標記一組定義
是時候嘗試處理描述列表了;將元素添加到輸入字段中顯示為描述列表。輸出量場。如果你愿意的話,你可以嘗試使用你自己的術語和描述。
如果您犯了錯誤,可以使用復位紐扣。如果你真的被卡住了,按下示解按鈕看答案。
引文
HTML還具有標記引號的功能;您使用的元素取決于是標記塊還是內聯引號。
區塊引號
如果塊級內容的一部分(無論是段落、多個段落、列表等)引用自其他地方,則應將其包裝在<區塊報價>元素中包含指向引號源的URL。引文屬性。例如,以下標記取自MDN<區塊報價>元素頁:
這個<強壯>HTML<電碼>區塊報價>;
下面是一段粗俗的引語..。
<區塊報價 引文="Https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote">這個<強壯>HTML<電碼>區塊報價>;
內聯報價
內聯引文的工作方式完全相同,但它們使用的是元素。例如,下面的標記位包含來自MDN的引用頁:
引用元素-<電碼>Q>;
引文
的內容引文屬性聽起來很有用,但是不幸的是,瀏覽器、屏幕閱讀器等等并沒有對它做太多事情。沒有辦法讓瀏覽器顯示引文,而不用使用JavaScript或CSS編寫自己的解決方案。如果您想在頁面上提供引號的來源,您需要通過鏈接或其他適當的方式使其在文本中可用。
有一個元素,但這意味著包含被引用的資源的標題,例如書的名稱。但是,沒有理由不能將文本鏈接到內部。以某種方式引用:
根據<一個 href="Https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote"> <引文>MDN區塊報價頁面
<區塊報價 引文=“Https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote”>
這個<強壯>HTML<電碼>區塊報價>;
引用元素-<電碼>Q>;
主動學習:誰說的?
是時候做另一個主動學習的例子了!在本例中,我們希望您:
將中間段轉換為塊引號,其中包括引文屬性。
將第三段中的“消除消極自我對話的需要”轉換為內聯引號,并包括引文屬性。
將每個源的相應標題包裝在標記并將每個標記轉換成指向該源的鏈接。
你需要的引文來源如下:
孔子名言的http://www.brainyquote.com/quotes/authors/c/confucius.html
Http://www.affirmationsforpositivethinking.com用于“需要消除消極的自我對話”。
如果您犯了錯誤,可以使用復位紐扣。如果你真的被卡住了,按下示解按鈕看答案。
縮略語
在瀏覽Web時,您將遇到的另一個相當常見的元素是-用于環繞縮寫或首字母縮略詞,并提供術語的全面擴展(包括在標題(屬性)讓我們看幾個例子:
我們用
我認為
注*還有另一個因素,<縮寫>,它基本上與,專門用于縮略語而不是縮略語。然而,這已經被廢棄了–它在瀏覽器中也不受支持。,和具有如此相似的功能,因此兩者兼而有之被認為是毫無意義的。只管用相反。
主動學習:標記縮寫
對于這個簡單的主動學習作業,我們希望你簡單地標記一個縮寫。您可以使用下面的示例,或者用您自己的示例替換它。
標記聯系人詳細信息
HTML有一個標記聯系人詳細信息的元素-<地址>。這只是簡單地封裝了您的聯系人詳細信息,例如:
<地址>
克里斯·米爾斯,曼徹斯特,格林北部,英國
<地址>
克里斯·米爾斯<溴>曼徹斯特<溴>格林北部<溴>英國
- <李>電話:01234 567890
<地址>
寫成的一頁<一個 href="/作者/克里斯-米爾斯/">克里斯·米爾斯
我的生日是25號<蘇普>TH
表示計算機代碼
有許多元素可用于使用HTML標記計算機代碼:
<代碼>*對計算機代碼中的通用代碼進行標記。
為了保留空白(通常是代碼塊)--如果您在文本中使用縮進或多余的空白,瀏覽器將忽略它,并且您不會在呈現的頁面上看到它。如果您將文本包裝在但是,您的空白將與您在文本編輯器中看到它的方式相同。 *專門標記變量名稱。 *對輸入到計算機的鍵盤(和其他類型)輸入進行標記。 用于標記計算機程序的輸出。 讓我們看幾個例子。你應該試著用這些來玩(試著拿一份我們的Other-semantics.html(樣本檔案):<預><電碼>Var Para=document.querySelector(‘p’);n npara.οnclick=function(){n警報(‘owww,停止戳我!’);n}總結
- 上一篇: UML之工具篇(Win10无法使用VGA
- 下一篇: BurpSuite-安全测试神器之代理设