HTML列表知識有序列表無序列表定義列表
列表在HTML中是一個常用的操作,幾乎很多網頁都出現了列表來顯示數據。今天我就在這裏來分享下有序列表、無序列表和定義列表的相關知識。從定義到實例的一個總結和概況。
有序列表
(01)有序列表是ol標籤和li標籤的組合表示,<ol>表示有序列表的開始,</ol>表示有序列表的結束。這裏爲了說明有序列表的用法,將張三,王四,李五,馬六用有序列表來表示出來。<html><head><title>列表控制</title></head><body><ol><li>張三</li><li>王四</li><li>李五</li><li>馬六</li></ol></body></html>如下圖可以看到執行的結果,前面自動天機了1234作爲序號。
(02)很多時候我們想在HTML中使用ABCD或者其他的需要來作爲有序列表的序號該怎麼做呢?在HTML中提供了小寫字母a來用小寫字母表示列表的序號,大寫字母A用大寫字母來表示列表的序號,i小寫羅馬數字來表示序號和I這個大寫的羅馬數字來表示序號。可以看如下實例。可以看到如下圖的代碼和例子,用大寫字母作爲這個有序列表的序號,寫法是type="A",執行結果是A、B、C、D的序號。
(03)對於有序列表來說,我們可能遇到一種情況是第二頁接着第一頁繼續書寫的,第二頁的序號不從一開始的。對於這個情況我們該怎麼設計呢?序號不從一開始的,HTML給ul提供了一個屬性,他就是start屬性,具體用法如下實例:(這個有序列表從10開始)<html><head><title>列表控制</title></head><body><ol type="1" start="10"><li>張三</li><li>王四</li><li>李五</li><li>馬六</li></ol></body></html>可以看到這個有序列表是從10開始的,往下繼續的一個序列號。
無序列表
(01)HTML中無序列表是用<ul>和<li>的組合控制標籤,<ul></ul>控制了無序列表的開始和結束,<li>/li>控制了列表中的項。具體實例如下:<html><head><title>列表控制</title></head><body><ul><li>張三</li><li>王四</li><li>李五</li><li>馬六</li></ul></body></html>從下圖執行結果可以看出,無序列表默認的是圓心實點作爲無序列表的標識。
(02)如果我麼不想無序列表前面的標識是圓心的實點該怎麼辦呢?這裏提供了disc 實心圓,circle空心圓,square實心方塊這幾種項目符號方便大家使用。具體實例如下:<html><head><title>列表控制</title></head><body><ul type="square"><li>張三</li><li>王四</li><li>李五</li><li>馬六</li></ul></body></html>可以看到項目符號變成了實心的方塊了。其實還有自訂的項目符文,這個我放在單獨的一個經驗中了。
定義序列
(01)定義列表是透過<dl><dt><dd>這三個組合標籤來實現的,<dl></dl>表示定義序列的開始和結束,<dt></dt>表示這被解釋的內容<dd></dd>對被解釋內容的一個解釋。<html><head><title>列表控制</title></head><body><dl><dt>考試科目</dt></dt><dd>語文</dd><dd>數學</dd><dd>英語</dd></dl></body></html>可以看到,被解釋的是考試科目,解釋內容爲下面這三個科目。這其中用到了縮進來表示的。
特別提示
程序設計需要不斷練習和學習
-
如何配置java的JDK環境變量
如何配置java的JDK環境變量呢?也許java開發人員剛接觸JDK工具時,不是很熟。現講下。操作方法(01)安裝JDK,安裝過程中可以自訂安裝目錄等資訊,例如我們選擇安裝目錄爲 C:\ProgramFiles\Java\jdk1.7.0_17;(02)安裝完成後,右擊“我的電腦”,點擊“屬性”;(03)選擇“進階”...
-
怎樣邀請QQ好友一起玩QQ遊戲
相信很多朋友喜歡和朋友一起玩遊戲,當然包括在電腦上玩咯,玩玩小遊戲解解悶是很多朋友喜歡的,小編就喜歡和好友一起玩QQ遊戲,還可以作弊的,哈哈。不知道怎麼邀請QQ好友一起玩遊戲的小夥伴快來圍觀吧。操作方法(01)登陸QQ(02)確認好友當前是否是電腦在線,不是電腦在線玩不...
-
手機PDF如何轉圖片格式,pdf轉圖片方法
在日常的工作或者學習中,有時會碰到需要將檔案中的某一頁或者是某幾頁轉爲圖片格式,那這個時候該怎麼辦呢?操作方法(01)第一步:首先在手機的應用市場裏找到工具(02)然後執行工具,在“PDF轉換”的頁面點擊PDF轉圖片。(03)第三步:在添加檔案的頁面選擇好需要轉換的檔案,然後點...
-
Python中如何應用split
我們用python處理字元串的時候經常會需要分割字元串,這個時候我們會用到split。那麼你真的會用它嗎?下面小編來給大家分享一下split的使用以及注意事項操作方法(01)首先我們在python環境中先來建立一個字元串,如下圖所示(02)然後我們調用split方法,已冒號作爲分隔符,如...