列表相关元素及其属性
生活随笔
收集整理的這篇文章主要介紹了
列表相关元素及其属性
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
HTML5保留了如下幾個列表相關元素:無序列表<ul>、有序列表<ol>、自定義列表<dl>
1、<ul>:定義無序列表,可以指定id、style、class等屬性,還可以指定onclick等事件屬性。
2、<ol>:定義有序列表,可以指定id、style、class等屬性,還可以指定onclick等事件屬性。除此之外,在HTML5規范中,該元素還可以指定如下三個屬性
- start:指定列表項的起始數字
- type:指定使用哪種類型的編號,例如1代表使用數字,A或a分別代表用大寫或小寫字母,I或i代表使用大寫或小寫羅馬數字。但該屬性在HTML規范中已經不推薦使用了,推薦使用CSS來定義。
- reversed:該屬性指定是否將排序反轉。該屬性是HTML 5新增的屬性。
例如如下代碼:
<body><h2>定義反序的有序列表</h2><ol reversed="true"><li>薯片</li><li>牛奶</li><li>巧克力</li></ol><h2>定義從3開始的有序列表</h2><ol start="3"><li>薯片</li><li>牛奶</li><li>巧克力</li></ol><h2>定義使用小寫字母編號的有序列表</h2><ol type="a"><li>薯片</li><li>牛奶</li><li>巧克力</li></ol><h2>定義使用小寫羅馬數字、從4開始的有序列表</h2><ol type="i" start="4"><li>薯片</li><li>牛奶</li><li>巧克力</li></ol> </body>其運行結果如下:
3、<dl>:用于定義術語列表。自定義列表不僅僅是一列項目,而是項目及其注釋的組合。自定義列表以 <dl> 標簽開始。每個自定義列表項以 <dt> 開始。每個自定義列表項的定義以 <dd> 開始。
- <dt>:定義標題列表項。可以指定id、style、class等屬性,還可以指定onclick等事件屬性。該元素只能包含文本、圖像、超鏈接、文本格式化元素和表單控件元素等
- <dd>:定義普通列表項。該元素可以包含與<div../>完全類似的內容。
例如如下代碼:
<body><h2>dt定義標題、dd定義解釋</h2><dl><dt style="color:red;">Java</dt><dd>Java是一門廣泛使用的、跨平臺的開發語言</dd><dt style="color:red;">Java簡介</dt><dd>Java是一門面向對象編程語言,不僅吸收了C 語言的各種優點,還摒棄了C 里難以理解的多繼承、指針等概念,因此Java語言具有功能強大和簡單易用兩個特征。</dd><dd>Java語言作為靜態面向對象編程語言的代表,極好地實現了面向對象理論,允許程序員以優雅的思維方式進行復雜的編程</dd></dl> </body>運行結果如下:
更多專業前端知識,請上 【猿2048】www.mk2048.com
總結
以上是生活随笔為你收集整理的列表相关元素及其属性的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 微信小程序下拉框
- 下一篇: 起名与选择器~(总结类、持续更新系列)