CSS 列表例項

2022-01-16 21:36:45 字數 1824 閱讀 6481

css 列表屬性允許你放置、改變列表項標誌,或者將影象作為列表項標誌。

css 列表屬性(list)

屬性 描述

list-style 簡寫屬性。用於把所有用於列表的屬性設定於乙個宣告中。

list-style-image 將圖象設定為列表項標誌。

list-style-position 設定列表中列表項標誌的位置。

list-style-type 設定列表項標誌的型別。

marker-offset

##########

定義和用法

list-style-type 屬性設定列表項標記的型別。

css2 的值:

值 描述

none 無標記。

disc 預設。標記是實心圓。

circle 標記是空心圓。

square 標記是實心方塊。

decimal 標記是數字。

decimal-leading-zero 0開頭的數字標記。(01, 02, 03, 等。)

lower-roman 小寫羅馬數字(i, ii, iii, iv, v, 等。)

upper-roman 大寫羅馬數字(i, ii, iii, iv, v, 等。)

lower-alpha 小寫英文本母the marker is lower-alpha (a, b, c, d, e, 等。)

upper-alpha 大寫英文本母the marker is upper-alpha (a, b, c, d, e, 等。)

lower-greek 小寫希臘字母(alpha, beta, gamma, 等。)

lower-latin 小寫拉丁字母(a, b, c, d, e, 等。)

upper-latin 大寫拉丁字母(a, b, c, d, e, 等。)

hebrew 傳統的希伯來編號方式

armenian 傳統的亞美尼亞編號方式

georgian 傳統的喬治亞編號方式(an, ban, gan, 等。)

cjk-ideographic 簡單的表意數字

hiragana 標記是:a, i, u, e, o, ka, ki, 等。(日文片假名)

katakana 標記是:a, i, u, e, o, ka, ki, 等。(日文片假名)

hiragana-iroha 標記是:i, ro, ha, ni, ho, he, to, 等。(日文片假名)

katakana-iroha 標記是:i, ro, ha, ni, ho, he, to, 等。(日文片假名)

##############

1.在無序列表中的不同型別的列表標記

本例演示在css中不同型別的列表項標記。

2.在有序列表中不同型別的列表項標記

本例演示在css中不同型別的列表項標記。咖啡茶

可口可樂咖啡茶

可口可樂咖啡茶

可口可樂咖啡茶

可口可樂咖啡茶

可口可樂咖啡茶

可口可樂

3.所有的列表樣式型別

本例演示在css中所有不同型別的列表項標記。

4.將影象作為列表項標記

本例演示如何將影象作為列表項標記。

5.放置列表標記

本例演示在何處放置列表標記。

該列表的 list-style-position的值是「inside」:

該列表的 list-style-position 的值是 "outside":

6.在乙個宣告中定義所有的列表屬性

本例演示將所有針對列表的屬性設定於乙個簡寫屬性。

CSS列表,定位和例項

每乙個成功者都有乙個開始。勇於開始,才能找到成功的路!今天讓我們繼續努力吧!加油!列表css 列表屬性允許你放置 改變列表項標誌,或者將影象作為列表項標誌。css 列表 從某種意義上講,不是描述性的文字的任何內容都可以認為是列表。人口普查 太陽系 家譜 參觀選單,甚至你的所有朋友都可以表示為乙個列表...

CSS例項篇 鏈結和列表

這是乙個鏈結 a link a visited a hover a active 2 在鏈結上使用文字裝飾 使用text decoration屬性,其取值有underline,line through,overline 對於鏈結而言,其預設值是underline 1 列表中所有不同的列表項標記 使用...

Vue例項列表

true model queryform class demo form inline 姓名 queryform.name placeholder 姓名 el input el form item 班級 queryform.classesid placeholder 請選擇班級 clearable ...