鏈枃灏嗕粙缁岰SS::marker涓竴涓洿鏈夎叮鐨勪吉鍏冪礌銆傛湁浜嗗畠锛屾垜浠彲浠ヨ鎴戜滑鐨勬枃瀛楁暟瀛楀彉寰楁洿鍔犳湁瓒ｏ紒浠€涔堟槸::markerCSS浼厓绱?:marker鏄疌SS浼厓绱燣evel3鏂板鐨勪吉鍏冪礌锛屾槸CSS浼厓绱燣evel4瀹屽杽鐨勬瘮杈冩柊鐨勪吉鍏冪礌锛孋hrome寮€濮嬫敮鎸佹祻瑙堝櫒86宀佷互涓娿€備娇鐢ㄥ畠锛屾垜浠彲浠ュ湪鍏冪礌涓坊鍔犱竴涓吉鍏冪礌鏉ョ敓鎴愰」鐩鍙锋垨鏁板瓧銆傞€氬父锛屾垜浠湁浠ヤ笅缁撴瀯锛?ul>

Contagious

Stages

Pages

Courageous

Shaymus

li>

Faceless

榛樿涓嶆坊鍔犱换浣曠壒娈婃牱寮忥紝鍏舵牱寮忓ぇ鑷存槸杩欐牱鐨勶細浣跨敤::marker锛屾垜浠彲浠ヤ慨鏀瑰簭鍒楀彿鍓嶉潰鐨勫皬鐐癸細li{padding-left:12px;娓告爣锛氭寚閽堬紱color:#ff6000;}li::marker{content:'>';}鍙互鎶婂皬鍦嗙偣鍙樻垚鎴戜滑鎯宠鐨勪换浣曚笢瑗匡細::marker浼厓绱犵殑涓€浜涢檺鍒堕鍏堬紝浣犲彲浠ュ搷搴?:marker鐨勫厓绱犲彲浠ュ彧鑳芥槸鍒楄〃椤癸紝姣斿ul閲岄潰鐨刲i鍜宱l閲岄潰鐨刲i閮芥槸鍒楄〃椤广€傚綋鐒朵笉鏄鎴戜滑瑕佺敤鍦ㄥ叾浠栧厓绱犱笂灏辨病鏈夊姙娉曘€傞櫎浜嗗垪琛ㄩ」锛屾垜浠彲浠ュ浠讳綍璁剧疆浜哾isplay:list-item鐨勫厓绱犱娇鐢?:marker浼厓绱犮€傚叾娆★紝瀵逛簬浼厓绱犱腑鐨剆tyle锛屽苟涓嶆槸浠讳綍style灞炴€ч兘鍙互浣跨敤锛岀洰鍓嶅彧鑳戒娇鐢ㄨ繖浜涳細鎵€鏈夊瓧浣撳睘鎬р€斺€旀墍浠ont灞炴€ф槸鍜宑olor鐩稿叧鐨勨€斺€旈鑹插€糲ontent灞炴€р€斺€攃ontentcontent锛岀被浼间簬::before浼厓绱犵殑鍐呭锛岀敤浜庡～鍏呭簭鍙风殑鍐呭text-combine-upright(en-US),unicode-bidianddirectionproperties--鍐欎綔鐩稿叧鐨勪竴浜涘簲鐢ㄦ帰绱ocument::marker鐨勬柟鍚戞瘮濡傛垜浠粡甯稿湪鏍囬鍓嶉潰鐪嬪埌涓€浜汥ecoration锛氭垨鑰咃紝鎴戜滑涔熷彲浠ョ敤emoji琛ㄦ儏锛氶兘闈炲父閫傚悎鐢?:marker鏉ュ睍绀恒€傝娉ㄦ剰锛岄潪鍒楄〃椤瑰厓绱犻渶瑕佹樉绀猴細list-item:

Loremipsumdolorsitamet

padding-left:8px;}h1::marker{content:'鈻?;}h1:nth-child(2)::marker{content:'馃槑';}CodePenDemo--::markerexample::marker鍙互鍔ㄦ€佸彉鍖栥€傛湁瓒ｇ殑鏄紝::marker浠嶇劧鍙互鍔ㄦ€佸彉鍖栥€備娇鐢ㄥ畠锛屾偍鍙互杞绘澗鍒涘缓涓€浜涙湁瓒ｇ殑鎮仠鏁堟灉銆傛瘮濡備綘娌¤閫変腑鏃朵笉寮€蹇冿紝琚€変腑鏃朵綘浼氬紑蹇冿細li{color:#000;transition:.2sall;}li:hover{color:#ff6000;}li::marker{content:'馃槱';}li:hover::marker{content:'馃榿';}CodePenDemo--::marker绀轰緥涓庤鏁板櫒涓€璧蜂娇鐢ㄣ€傚彲浠ヨ瀵熷埌::marker浼厓绱犱笌::before鍜?:after浼厓绱犻潪甯哥浉浼硷紝瀹冧滑閮芥湁涓€涓猚ontent灞炴€с€傚湪鍐呭涓婏紝鍏跺疄鍙互搴旂敤涓€浜涚畝鍗曠殑瀛楃涓茬浉鍔犳搷浣溿€傚埄鐢ㄨ繖涓紝鎴戜滑鍙互閰嶅悎CSS璁℃暟鍣╟ounter-reset鍜宑ounter-increment瀹炵幇瀵?:marker鍏冪礌娣诲姞搴忓彿鐨勬搷浣溿€傚鏋滀綘涓嶅お浜嗚В鍙嶅閲忥紝浣犲彲浠ュ幓杩欓噷锛歁DN--counter-increment

LoremIpsumDolorSitAmet

LoremIpsumDolorSitwiththeintentionofadipisicingelit.

Itaquesequieaqueearumlaboriosam.

浣犳兂濡栧▎鐨勫師鍥犳槸浠€涔堬紵

Laudantiumsapientecommodiquidemexcepturi!h3>

LoremIpsumDolorSitAmetConsecteturAdipisicingElit銆?/p>濡傛灉浣犳鍦ㄦ壘宸ヤ綔锛屼綘鍙互浣跨敤::marker鍜孋SScountercounter-increment瀹炵幇涓€涓嚜鍔ㄨ鏁扮殑鏈夊簭鍒楄〃锛宧3:body鍓嶉潰鏈変竴涓猠moji{鍙嶉噸缃細h3锛泒h3{鍙嶅閲忥細h3锛涙樉绀猴細鍒楄〃椤癸紱}h3::marker{鏄剧ず锛氬垪琛ㄩ」锛涘唴瀹癸細鈥溾湐鈥濊鏁板櫒锛坔3锛夆€溾€濓紱棰滆壊锛氭祬椴戦奔鑹诧紱font-weight:bold;}CodePenDemo--::markerexample鏈€鍚庯紝鏈枃浠嬬粛浜嗕粈涔堟槸::marker锛屼互鍙婂畠鐨勪竴浜涘疄闄呭満鏅€傚彲浠ョ湅鍒拌櫧鐒?:before鍜?:after涔熷彲浠ュ疄鐜扮被浼肩殑鍔熻兘锛屼絾鏄疌SS杩樻槸鎻愪緵浜嗘洿鍔犺涔夊寲鐨刲abel::marker锛岃繖涔熻鏄庡ぇ瀹堕渶瑕佹洿鍔犳敞鎰忚嚜宸卞墠绔唬鐮佺殑璇箟锛圚TML/CSS锛夈€傚ソ浜嗭紝鏈枃鍒版缁撴潫锛屽笇鏈涘浣犳湁鎵€甯姪:)鎯宠鑾峰彇鏈€鏈夎叮鐨凜SS璧勮锛屼笉瑕侀敊杩囨垜鐨勫叕浼楀彿鈥斺€攊CSS鍓嶇濂囬椈杞朵簨馃槃鏇村绮惧僵CSS鎶€鏈枃绔犳眹鎬诲湪鎴戠殑Github鈥斺€攊CSS锛屾寔缁洿鏂帮紝娆㈣繋鐐逛釜鏄熻闃呮敹钘忋€傛湁浠€涔堥棶棰樻垨鑰呭缓璁彲浠ュ浜ゆ祦銆傚師鍒涙枃绔犳枃绗旀湁闄愶紝鐭ヨ瘑鍖箯銆傚鏋滄枃绔犱腑鏈変换浣曚笉鍑嗙‘鐨勫湴鏂癸紝璇峰憡璇夋垜銆?/p>