list-style-type的简介
list-style-type:none;\u4ec0\u4e48\u610f\u601d\u8bbe\u7f6e\u5217\u8868\u7684\u683c\u5f0f\u4e3anone\u3002\u4e5f\u5c31\u662f\u6ca1\u6709\u683c\u5f0f\u3002\u5217\u8868\u683c\u5f0f\u6709\u597d\u51e0\u79cd\u3002\u6709\u524d\u9762\u662f\u5706\u70b9\u7684\u3002\u6709\u662f\u5c0f\u6b63\u65b9\u5feb\u7684\u7b49\u7b49\u3002
list-style-type \u987e\u540d\u601d\u4e49
list\u5217\u8868
style\u6837\u5f0f
type\u7c7b\u578b
\u6574\u53e5\u8bdd\u89e3\u91ca\u5c31\u662f"\u5217\u8868\u6837\u5f0f\u7c7b\u578b"\u554a
\u4f60\u53ef\u4ee5\u770b\u770b\u6548\u679c
a1 ul li {list-style-type:decimal;}
1
2
3
在HTML中，type属性来定义列表项符号，那是在元素属性中定义的。但是我们不建议使用type属性来定义元素的样式。
在CSS中，不管是有序列表还是无序列表，都统一使用list-style-type属性来定义列表项符号。
有序列表list-style-type属性取值如下： list-style-type属性值说明decimal默认值，数字1、2、3……lower-roman小写罗马数字i、ii、iii……upper-roman大写罗马数字I、II、III……lower-alpha小写英文字母a、b、c……upper-alpha大写英文字母A、B、C……无序列表list-style-type取值： list-style-type属性值说明disc默认值，实心圆“●”circle空心圆“○”square实心正方形“■” list-style-type：disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none | armenian | cjk-ideographic | georgian | lower-greek | hebrew | hiragana | hiragana-iroha | katakana | katakana-iroha | lower-latin | upper-latin
默认值：disc disc：
实心圆(CSS1)
circle：
空心圆(CSS1)
square：
实心方块(CSS1)
decimal：
阿拉伯数字(CSS1)
lower-roman：
小写罗马数字(CSS1)
upper-roman：
大写罗马数字(CSS1)
lower-alpha：
小写英文字母(CSS1)
upper-alpha：
大写英文字母(CSS1)
none：
不使用项目符号(CSS1)
armenian：
传统的亚美尼亚数字(CSS2)
cjk-ideographic：
浅白的表意数字(CSS2)
georgian：
传统的乔治数字(CSS2)
lower-greek：
基本的希腊小写字母(CSS2)
hebrew：
传统的希伯莱数字(CSS2)
hiragana：
日文平假名字符(CSS2)
hiragana-iroha：
日文平假名序号(CSS2)
katakana：
日文片假名字符(CSS2)
katakana-iroha：
日文片假名序号(CSS2)
lower-latin：
小写拉丁字母(CSS2)
upper-latin：
大写拉丁字母(CSS2) 设置或检索对象的列表项所使用的预设标记。
若list-style-image属性为none或指定图像不可用时，list-style-type属性将发生作用。
仅作用于具有display值等于list-item的对象（如li对象）。
注意：ol对象和ul对象的type特性为其后的所有列表项目（如li对象）指明列表属性。
对应的脚本特性为listStyleType。
绛旓細1 html涓殑鏃犲簭鍒楄〃鏄痷l鏍囩锛岃繖涓爣绛炬湰韬嚜甯﹀睘鎬э紝鍓嶉潰鏈夊皬鍦嗙偣,涓涓疄闄呯殑鏁堟灉璇存槑涓嬶紙濡備笅鍥撅級锛氬氨鐪嬪埌浜嗘ゼ涓婃墍璇寸殑鍦嗙偣浜 2 鍘婚櫎鍦嗙偣 缁檒i璁剧疆鏍峰紡 锛 鍦╯tyle涓缃細 list-style-type:none 灏辨妸姣忎釜li鍓嶉潰鐨勫渾鐐瑰幓鎺変簡 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <...
绛旓細ul 鏍囩 瀹氫箟鏃犲簭鍒楄〃銆俹l 鏍囩 瀹氫箟鏈夊簭鍒楄〃銆俵ist-style鏄list-style-type涓嶅姞灞炴х殑绠鍐 list-style-type 灞炴ц缃垪琛ㄩ」鏍囪鐨勭被鍨嬶細none 鏃犳爣璁般俤isc 榛樿銆傛爣璁版槸瀹炲績鍦嗐俢ircle 鏍囪鏄┖蹇冨渾銆俿quare 鏍囪鏄疄蹇冩柟鍧椼俤ecimal 鏍囪鏄暟瀛椼俻adding:0;灏辨槸涓婂彸涓嬪乏 鍐呰竟璺濈殑瀹藉害...
绛旓細鍘绘帀椤圭洰绗﹀彿鐨勶紝姣斿浣犵敤浜<ul><li></li><li></li></ul>榛樿鐨刲i閲岃竟鐨勫瓧鏄湁鍒楄〃绗﹀彿鐨勶紝灏忓渾鐐广傝繖涓list-style-type: none灏辨槸涓嶈鍒楄〃绗﹀彿
绛旓細瑙ｅ喅鎬濊矾锛氬湪HTML涓病鏈夌浉搴旂殑灞炴у彲浠ヨ缃鏁堟灉锛屼絾鍦–SS涓彲浠ワ紝鐩稿簲鐨勫睘鎬т负list-style-type锛岃鎶婂渾鐐规敼鎴愬疄蹇冩柟鍧楋紝鍙渶瑕佽缃甽ist-style-type鐨勫间负square銆傚叿浣撴楠わ細浠ｇ爜绀轰緥锛<ul style="list-style-type:square"> <li>list1 <li>list2 <li>list3 <li>list4 </ul> 鎶宸э細鎯冲繀澶у閮...
绛旓細鍏朵粬鍥炵瓟 鎶婄偣鍒囧嚭鏉,鐒跺悗宸茶儗鏅殑鏂瑰紡鏀惧湪li 閲岄潰.list-style-type:disc杩欎釜灞炴у緢涓嶅ソ鎺у埗鐨勩傘 鐑績缃戝弸| 鍙戝竷浜2013-08-24 涓炬姤| 璇勮(1) 1 10 涓烘偍鎺ㄨ崘: css !-- style鏄粈涔堟剰鎬 css:style css # . css鐨剆tyle鏄粈涔 html style鏍囩 style 鍜宐ody css闅愯棌 ul鏍囩 ul鐨則ype...
绛旓細1銆佸湪鐢佃剳涓婃墦寮杞欢锛屾柊寤轰竴涓猦tml鏂囦欢锛屽湪head閮ㄥ垎锛岀紪鍐檆ss鏍峰紡锛 list-style-type: none;鏄櫎鎺夊鑸墠闈㈤粯璁ゅ甫鐨勭偣锛宭i a锛宭i a.active 锛宭i a:hover:not(.active) 璁剧疆榧犳爣婊戝埌瀵艰埅鏍忕殑棰滆壊鍙樺寲銆2銆佸湪html椤甸潰body閲岄潰缂栧啓瀵艰埅鏍忓唴瀹癸紝鍙互鐪嬪埌鏄氳繃<ul><li><a href=""></a></li><...
绛旓細list-style鐨勯鑹插彲浠ヨ嚜宸辨牴鎹渶瑕佽缃紝鏂规硶鏄粰<ul>鏍囩鍔犱笂color灞炴у硷紝杩欐牱灏变細鏀瑰彉list-style 鐨勯鑹诧紝骞朵笖涓嶄細褰卞搷鏂囧瓧鐨勯鑹诧細渚嬪锛歨tml浠ｇ爜涓猴細<ul> <li><a href="#" title="鐧惧鍚堢">鐧惧鍚堢</li></ul> css鏍峰紡浠ｇ爜锛歶l {padding-left:15px;color:#d1c098;} li {height:20px;...
绛旓細鍦ㄧ浉鍏崇殑椤甸潰鎵惧埌head閮ㄥ垎鍐欏叆<style type="text/css">list-style:none;</style>锛岀粰li鍔犱笂 list-style-type:none杩欎釜鏍峰紡灏卞彲浠ヤ簡娑堥櫎榛戠偣銆傚叿浣撴楠ゅ涓嬶細1.杩欎釜鏍囩鏈韩鑷甫灞炴э紝鍓嶉潰鏈夊皬鍦嗙偣鏄畠鐨勫疄闄呯殑鏁堟灉锛屽涓嬪浘銆2.鍔犱笂 li{list-style-type:none;} 鏍峰紡涔嬪悗鍦ㄩ〉闈笂鐨勬樉绀烘晥鏋溿
绛旓細鍚戜笅婊氬姩骞跺湪CSSDesigner閫夐」鍗″簳閮ㄧ殑绐楁牸涓崟鍑list-style-type銆傚湪鍑虹幇鐨勫脊鍑鸿彍鍗曚腑鍗曞嚮鏃犮5銆佹洿鏀规偍鐨勬帓搴忓垪琛ㄤ互姘村钩鏄剧ず銆備负姝わ細鍗曞嚮鈥滈夋嫨鍣ㄢ濇爣棰樺彸渚х殑+銆傞敭鍏#nameli鍏朵腑鈥滃悕绉扳濇槸鍒楄〃鍚嶇О鐨勫湴鏂广傚湪鈥淐SS璁捐鍣ㄢ濋夐」鍗″簳閮ㄧ殑绐楁牸涓壘鍒扳滄诞鍔ㄢ濇爣棰樸傚崟鍑烩滄诞鍔ㄢ濇爣棰樺彸渚х殑鍚戝乏鎸夐挳銆6銆佷负鎮...
绛旓細寮曠敤鑷畾涔夊浘鐗 璇硶锛歭ist-style-image : none | url (url)eg. li {list-style-image : url (image/aa.gif);} 寮曠敤绯荤粺鍥炬 璇硶锛list-style-type : disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none | armenian | cjk-...
