ང་གིས་ CSS འཕེལ་འགྱུར་ཚུ་ དབྱེ་ཁག་ནང་ བགོ་བཤའ་རྐྱབ་དགོ་པ་ཅིན་ ང་བཅས་ཀྱིས་ མ་འོངས་པ་ལུ་ སྡོད་དོ་བཟུམ་སྦེ་ མནོ་བསམ་གཏང་ནིའི་དོན་ལུ་ ས་མཚམས་ཀྱི་ དབྱིབས་འདི་ འཇམ་ཏོང་ཏོ་སྦེ་ ཞུ་བའི་ཉིནམ་ཚུ་ལས་ ཐག་རིང་སར་ འགྱོ་སྟེ་ཡོདཔ་ཨིན། ད་རེས་ ང་བཅས་ར་ མཐོང་སྣང་གི་བང་རིམ་འདི་ བསྒྱུར་བཅོས་འབད་ནི་རྐྱངམ་ཅིག་མེན་པར་ གཞི་རྟེན་གྱི་ཐོག་ལས་ ང་བཅས་ཀྱིས་ ངོས་འདྲ་བ་ཚུ་ ག་དེ་སྦེ་བཟོཝ་ཨིན་ན་ ལོག་སྟེ་ར་ གསལ་བཀོད་འབད་བའི་བསྒང་ཡོདཔ་ཨིན། ང་གིས་ ༢༠༢༤ ལུ་ གསལ་བསྒྲགས་འབད་མི་ ཁྱད་རྣམ་ཚུ་གི་གྱངས་ཁ་འདི་ མཐོ་ཤོས་ཅིག་ལུ་ལྷོད་མི་ཚུགས་ཟེར་མནོ་ཡི། ང་གིས་ དེ་སྦེ་ དགའ་སྤྲོ་ཐོག་ལས་ འཛོལ་བ་མ་འབད་བས། Chrome སྡེ་ཚན་གྱི་ “CSS Wrapped 2025” འདི་ ཁྱད་རྣམ་ཚུ་གི་ཐོ་ཡིག་རྐྱངམ་ཅིག་མེན། འདི་ ཕན་ནུས་ཅན་གྱི་ ས་གནས་ཀྱི་ཝེབ་ཅིག་གི་དོན་ལུ་ ཁས་བླངས་ཅིག་ཨིན། འདི་ཡང་ འབྲུག་རྒྱང་བསྒྲགས་ལས་འཛིན་གྱིས་ འབྲུག་རྒྱང་བསྒྲགས་ལས་འཛིན་གྱི་ འགོ་དཔོན་ཚུ་ལུ་ བརྡ་འཕྲིན་ཅིག་བཏང་ཡོདཔ་ཨིན། ང་བཅས་ཀྱིས་ “Optimized Ergonomics” དང་ “Next-gen interactions” ལུ་བསྒྱུར་བཅོས་འགྱོ་དོ་ཡོདཔ་ལས་ ང་བཅས་ལུ་ གསང་ཡིག་དང་འཐབ་འཛིང་འབད་ནི་འདི་བཀག་ཞིནམ་ལས་ ཁོང་རའི་རང་བཞིན་གནས་སྟངས་ནང་ ངོས་འདྲ་བ་ཚུ་ བཟོ་བཀོད་འབད་ནི་འགོ་བཙུགས་བཅུགཔ་ཨིན། འདི་ཡང་ རྩོམ་བྲིས་འདི་ནང་ ཁྱོད་ཀྱིས་ Chrome གི་སྙན་ཞུ་ནང་ལས་ ཁྱད་རྣམ་ཚུ་ ཡོངས་སུ་རྫོགསཔ་སྦེ་ བལྟ་ཚུགས་ནི་ཨིནམ་ལས་ ངེ་གི་འཕྲལ་ཁམས་ཀྱི་ བརྟག་དཔྱད་ཚུ་གི་མཐོང་སྣང་ནང་ལས་ བལྟ་ཚུགས་ནི་ཨིནམ་མ་ཚད་ མ་འོངས་པའི་ གཞི་རྟེན་གྱི་རེ་བ་ཚུ་ཡང་ མཐོང་ཚུགས་ནི་ཨིན་མས། ཆ་ཤས་གཞི་སྒྱུར་: མཐའ་མཇུག་ལུ་ ས་གནས་ཀྱི་སྲོལ་སྒྲིག་འབད་བཏུབ་པའི་སེལ་འཐུ་ཅིག ལོ་ངོ་བཅུ་ཕྲག་ལས་བཅད་དེ་ ང་བཅས་ཀྱིས་ ཇ་བ་ཨིསི་ཀིརིཔ་དཔེ་མཛོད་ལྗིད་ཅན་ཚུ་ལུ་ བློ་གཏད་དེ་ བཀོག་བཞག་སྟེ་ཡོད་མི་ “ལོ་ངོ་བཅུ་ཕྲག་རྙིངམ་གི་དཀའ་ངལ་” མཐའ་མཇུག་ལུ་ སྟེགས་བུ་འདི་གིས་ བསལ་ཡོདཔ་ཨིན། འདོན་སྤེལ།: ༢༠༡༠/༠༣/༠༣ རིག་པ།(༠) འདི་ཡང་ འབྲུག་རྒྱང་བསྒྲགས་ལས་འཛིན་གྱིས་ འབྲུག་རྒྱང་བསྒྲགས་ལས་འཛིན་གྱི་ འགོ་དཔོན་ཚུ་ལུ་ བརྡ་འཕྲིན་ཅིག་བཏང་ཡོདཔ་ཨིན། མཐོང་སྣང་གི་ངོ་སྤྲོད་: གཞི་རྟེན་-སེལ་འཐུ་འདི་ གཞི་རྟེན་སྒྲིང་སྒྲིང་ཅིག་ཨིན། འདི་གིས་ ང་བཅས་ལུ་
གདམ་ཁ་ཚུ་ནང་ ནང་དོན་ཕྱུགཔོ་ཚུ་ དཔེར་ན་ པར་རིས་ཡང་ན་ དར་ཆ་ཚུ་ འབད་བཅུག་ནིའི་དོན་ལུ་ ཡ་མཚན་ཅན་གྱི་ཁ་སྐོང་འདི་ སྤྲོ་བ་ཆེ་ཏོག་ཏོ་ཅིག་ཨིན། ང་བཅས་ཀྱིས་ ད་རེས་ནངས་པར་ སེལ་འཐུ་མ་འདྲཝ་ཚུ་ག་ར་གསར་བསྐྲུན་འབད་ཚུགས།
བརྡ་སྟོན་: ང་གིས་ གདམ་ཁ་ཅིག་ལས་ ཨེབ་རྟ་ནང་ལུ་ ཐད་ཀར་དུ་
གདམ་ཁ་ཚུ་གི་ནང་ན་པར་ཚུ་དང་གཅིག་ཁར་ སྲོལ་སྒྲིག་འབད་བཏུབ་པའི་ སེལ་འཐུ་འབད་བཏུབ་པའི་ སྨྱུ་གུ་དང་ utilitybend གིས་ སེལ་འཐུ་འབད་ཡོད་པའི་ནང་དོན་ [forked] འདི་བལྟ།
བརྡ་སྟོན: རྫུས་མའི་ཆ་ཤས་ཚུ་དང་གཅིག་ཁར་ སེལ་འཐུ་འབད་ནིའི་བཟོ་རྣམ་བཟོ་ནི་ལུ་ ཡོངས་སུ་རྫོགས་པའི་བལྟ་སྟངས།
utilitybend གིས་ pseudo-elements [forked] རྐྱངམ་ཅིག་དང་གཅིག་ཁར་ སྲོལ་སྒྲིག་འབད་བཏུབ་པའི་ སེལ་འཐུ་འབད་བཏུབ་པའི་ Pen A བལྟ།
བརྡ་སྟོན་: ཡང་ན་ ཁྱོད་ཀྱིས་ གདམ་ཁ་སྡེ་ཚན་ཚུ་ལག་ལེན་འཐབ་སྟེ་ དཀར་ཆག་སེལ་འཐུ་བརྡ་སྟོན་འདི་དང་གཅིག་ཁར་ མཐོ་ཚད་ཅིག་ཡར་འཐེན་ཚུགས།
བལྟ། པེན་ ངོ་མའི་སེལ་འཐུ་དཀར་ཆག་ གདམ་ཁ་སྡེ་ཚན་ [forked] གིས་ utilitybend གིས་ བཙུགས། འ་ནི་ཁྱད་རྣམ་འདི་གིས་ ང་བཅས་ཀྱིས་ འབྲི་ཤོག་ཚུ་ ག་དེ་སྦེ་བཟོ་ནི་ཨིན་ན་དང་ བརྟེན་སྡོད་མི་དང་ འཕྲུལ་རིག་གི་བུ་ལོན་ཚུ་ མར་ཕབ་འབད་ནི་ཨིན་ནའི་ འགྱུར་བ་སྦོམ་ཅིག་ བརྡ་སྟོནམ་ཨིན། བཤུད་སྒྲིལ་རྟགས་མཚན་དང་ ཇ་བ་ཨིསི་ཀིརིཔཊི་ ཀ་རུ་སེལ་གྱི་འཆི་བ། འགྲུལ་འཁོར་བཟོ་ནི་འདི་ བྱུང་རབས་དང་འཁྲིལ་ཏེ་ གོང་འཕེལ་གཏང་མི་དང་ མཁོ་མངགས་འབད་མི་ཚུ་གི་བར་ན་ འཁྲུག་རྩོད་ཀྱི་གནད་དོན་ཅིག་སྦེ་སྡོད་ནུག མཁོ་མངགས་འབད་མི་ཚུ་གིས་ ཁོང་ལུ་དགའཝ་ལས་ གོང་འཕེལ་གཏང་མི་ཚུ་གིས་ འཛུལ་སྤྱོད་འབད་ཚུགསཔ་དང་ ལཱ་འབད་ཚུགསཔ་བཟོ་ནི་གི་དོན་ལུ་ ཇ་བ་ཨིསི་ཀིརིཔཊི་དགོཔ་སྦེ་ འདྲོགས་ཏེ་ཡོདཔ་ཨིན། ::བཤུད་སྒྲིལ་-རྟགས་བཀོད་མི་དང་ ::བཤུད་སྒྲིལ་-ཨེབ་རྟ་() རྫུས་མའི་ཆ་ཤས་ཚུ་འོང་མི་འདི་གིས་ འ་ནི་ཌའི་ནམ་འདི་ཡོངས་རྫོགས་སྦེ་བསྒྱུར་བཅོས་འབདཝ་ཨིན། ཁྱད་རྣམ་འདི་ཚུ་གིས་ ང་བཅས་ལུ་ འགྲུལ་བསྐྱོད་ཀྱི་ཚག་དང་ བཤུད་སྒྲིལ་གྱི་ཨེབ་རྟ་ཚུ་ བཤུད་སྒྲིལ་གྱི་དོས་ལུ་ རང་བཞིན་གྱི་འབྲེལ་མཐུད་འབད་དེ་ཡོད་མི་ སི་ཨེསི་ཨེསི་དང་གཅིག་ཁར་ ངོ་མ་སྦེ་གསར་བསྐྲུན་འབད་བཅུགཔ་ཨིན། ང་གིས་ ངེ་གི་དྲ་ཚིགས་ནང་ལུ་བྲིས་དོ་བཟུམ་སྦེ་ འདི་བཤུད་བརྙན་འགོ་དང་པ་ནང་ བརྩེ་བ་ཨིན། ཇ་བ་ཨིསི་ཀིརིཔཊི་གི་གྲལ་ཐིག་གཅིག་མེད་པར་ ལཱ་འགན་ཆ་ཚང་ཡོད་པའི་ འཛུལ་སྤྱོད་འབད་བཏུབ་པའི་བཤུད་ཕྲ་ཅིག་གསར་བསྐྲུན་འབད་ཚུགས་པའི་ ལྕོགས་གྲུབ་འདི་ སྟབས་བདེ་ཏོག་ཏོ་རྐྱངམ་ཅིག་མེན། འདི་འཁྲབ་སྟོན་གྱི་རྒྱལ་ཁ་ཨིན། ཁྱད་རྣམ་འདི་གི་མཐའ་འཁོར་ལུ་ འཛུལ་སྤྱོད་ཀྱི་ཚ་གྱང་ལ་ལུ་ཅིག་ཡོདཔ་ལས་ འདི་ཚུ་ནུས་ཅན་ཨིན་རུང་ ང་བཅས་གོང་འཕེལ་གཏང་མི་ཚུ་ལུ་ ལཱ་འབད་བཅུག་ནི་གི་ཐབས་ལམ་ཅིག་འོང་། འདོན་སྤེལ།: ༢༠༡༠/༠༣/༠༣ རིག་པ།(༡) འདི་ཡང་ གཟའ་ཉི་མའི་ཉིན། ད་ལྟོ་ང་བཅས་ཀྱིས་ བཤུད་སྒྲིལ་-རྟགས་བཀོད་-སྡེ་ཚན་ལག་ལེན་འཐབ་སྟེ་ རྟགས་བཀོད་མི་ཚུ་ རང་བཞིན་གྱིས་སྡེ་ཚན་བཟོ་ཚུགས་ནི་དང་ ང་བཅས་ལུ་དགོ་ས་ལུ་ ཏན་ཏན་སྦེ་བཞག་ནི་ལུ་ ཨེན་ཀོར་གནས་ས་ལག་ལེན་འཐབ་ཐོག་ལས་ ཨེབ་རྟ་ཚུ་བཟོ་རྣམ་བཟོ་ཚུགས།
.ཀ་རོ་སེལ་ { . overflow-x: རང་བཞིན་; scroll-marker-སྡེ་ཚན་: ཤུལ་ལས་; /* ཚག་ཚུ་གི་དོན་ལུ་ དོས་ཆས་གསར་བསྐྲུན་འབདཝ་ཨིན། */
/* ཨེབ་རྟ་ཚུ་གསར་བསྐྲུན་འབད། */ &::བཤུད་སྒྲིལ་-ཨེབ་རྟ་(ནང་ཐིག་-མཇུག་),&::བཤུད་སྒྲིལ་-ཨེབ་རྟ་(ནང་གྲལ་-འགོ་བཙུགས་) { content: " "; position: ཆ་ཚང་; /* དེ་ཚུ་དབུས་སྒྲིག་འབད་ནི་ལུ་ ཨེན་ཀོར་གནས་ས་ལག་ལེན་འཐབ། */ position-anchor: --ཀ་རོ་སེལ་; top: anchor(དབུས་); } .
/* ཨ་ལོ་ཚུ་གུ་རྟགས་བཀོད་མི་ཚུ་གསར་བསྐྲུན་འབད། */ div { . &::བཤུད་སྒྲིལ་རྟགས་ { content: " "; width: 24px; ས་མཚམས་-ཕྱེད་ཀ་: 50%; cursor: དཔག་བྱེད་; } . /* ཤུགས་ལྡན་རྟགས་བཀལ་མི་འདི་འོད་རྟགས་བཀལ། */ &::བཤུད་སྒྲིལ་-རྟགས་:དམིགས་གཏད་-ད་ལྟོའི་ { རྒྱབ་ལྗོངས་: དཀརཔོ་; } . } . } .
བརྡ་སྟོན་: ངེ་གི་བརྟག་དཔྱད་འདི་ ཨེཆ་ཊི་ཨེམ་ཨེལ་དང་ སི་ཨེསི་ཨེསི་ལས་ གཙང་སྦྲ་ཅན་གྱི་ ཀ་རུ་སེལ་ཅིག་ བཟོ་སྟེ་ ཨེབ་རྟ་ཚུ་བཙུགས་ནིའི་དོན་ལུ་ གཞི་རྟེན་གནས་ས་ལག་ལེན་འཐབ་ཨིན།
ཡུ་ཊི་ལི་ཊི་བེནཌ་གིས་ པེན་ཀ་རོ་སེལ་ པུར་ཨེཆ་ཊི་ཨེམ་ཨེལ་དང་ སི་ཨེསི་ཨེསི་ [ཕོརཀ་] བལྟ།
བརྡ་སྟོན་: རྒྱབ་གཞི་གཟུགས་བརྙན་ཚུ་ རྟགས་བཀོད་མི་ཚུ་ནང་ལུ་ མགྱོགས་དྲགས་སྦེ་འཐེན་ནི་ལུ་ attr() ལག་ལེན་འཐབ་སྟེ་ ཝེབ་ཚོང་ཁང་གི་བཤུད་སྒྲིལ་འདི་ ལོག་བཟོ།
utilitybend གིས་ CSS [forked] ནང་ལུ་ པེན་ཝེབ་ཤོབ་ཀྱི་ བཤུད་བརྙན་བསྐྱར་བཟོ་འདི་བལྟ། མངའ་སྡེའི་དྲི་བ།: འབྱར་བའི་དངོས་པོ་བཀག་ཡོད་དམ། Snappy ཐིང་འདི་ བརྡུངས་ཡོདཔ་ཨིན་ན? དུས་ཡུན་རིངམོ་ཅིག་གི་རིང་ལུ་ ང་བཅས་ཀྱིས་ “འཐུད་པའི་ཅ་ལ་ཅིག་ བཀག་བཞག་ཡོདཔ་ཨིན་ན” ཡང་ན་ “འཐུད་པའི་ཅ་ཆས་ཅིག་ བཀག་བཞག་ཡོདཔ་ཨིན་ན” ཟེར་ ཤེས་ཚུགས་པའི་ ལྕོགས་གྲུབ་མེདཔ་ཨིན། Chrome 133 གིས་ བཤུད་སྒྲིལ་གནས་སྟངས་འདྲི་དཔྱད་ཚུ་འགོ་བཙུགས་ཡོདཔ་ལས་ ང་བཅས་ལུ་ གནས་སྟངས་འདི་ཚུ་ གསལ་བསྒྲགས་འབད་དེ་འདྲི་དཔྱད་འབད་བཅུགཔ་ཨིན། དོས་ཆས་དབྱེ་བ་: བཤུད་སྒྲིལ་གནས་སྟངས་གཞི་སྒྲིག་འབད་ཐོག་ལས་ ད་ལྟོ་ང་བཅས་ཀྱིས་ ཨ་ལུ་ཚུ་ བཀག་བཞག་ཡོདཔ་ཨིན་ན་ བརྡུང་ཡོདཔ་ཨིན་ན་ ཡང་ན་ ཆུ་བཏོན་ཡོདཔ་ཨིན་ན་ལུ་གཞི་བཞག་སྟེ་ བཟོ་རྣམ་བཟོ་ཚུགས། འདོན་སྤེལ།: ༢༠༡༠/༠༣/༠༣ རིག་པ།(༠) འདི་ཡང་ འབྲུག་རྒྱང་བསྒྲགས་ལས་འཛིན་གྱིས་ འབྲུག་རྒྱང་བསྒྲགས་ལས་འཛིན་གྱི་ འགོ་དཔོན་ཚུ་ལུ་ བརྡ་འཕྲིན་བཏང་ཡོདཔ་ཨིན། དཔེ་འཇམ་ཏོང་ཏོ་ཅིག་གི་དོན་ལུ་: ང་བཅས་ཀྱིས་ མཐའ་མཇུག་ལུ་ གྱིབ་མ་ཅིག་ མགོ་ཡིག་ཅིག་ལུ་ མཐོང་སྣང་འདྲེན་ལམ་གྱི་མགོ་ལུ་ ངོ་མ་སྦེ་ འཐུད་པའི་སྐབས་རྐྱངམ་ཅིག་ འཇུག་སྤྱོད་འབད་ཚུགས། .མགོ་ཡིག་-དོས་ཁང་ { . container-type: བཤུད་སྒྲིལ་གནས་སྟངས།; position: འབྱར་པོ།; top: ༠;
མགོ་ཡིག་ { transition: སྒྲོམ་-གྱིབ་མ་ ༠.༥s འཇམ་ཏོང་ཏོ་-ཕྱིར་ཐོན།; /* འདྲི་དཔྱད་འདི་གིས་ དོས་ཁང་གི་གནས་སྟངས་ཞིབ་དཔྱད་འབདཝ་ཨིན། */ @container བཤུད་སྒྲིལ་-གནས་སྟངས་(བཀག་བཞག་: མགོ་) { box-shadow: རྒབ་(༠, ༠, ༠, ༠.༦) ༠པི་ཨེགསི་ ༡༢པི་ཨེགསི་ ༢༨པི་ཨེགསི་ ༠པི་ཨེགསི་; } . } . } .
བརྡ་སྟོན་: གྱིབ་མ་ཅིག་ངོ་མ་སྦེ་བཀག་བཞག་པའི་སྐབས་རྐྱངམ་ཅིག་འཇུག་སྤྱོད་འབད་མི་ སྦྱར་རྩི་ཅན་གྱི་མགོ་ཡིག་ཅིག།
བཤུད་སྒྲིལ་གནས་སྟངས་འདྲི་དཔྱད་དང་གཅིག་ཁར་ པེན་སི་ཊིཀ་མགོ་ཡིག་ཚུ་བལྟ་ འབྲེལ་མཐུད་ཆ་ཤས་འདི་ ཡུ་ཊི་ལི་ཊི་བེནཌི་གིས་ [ཕོརཀ་] བཀག་བཞག་ཡོདཔ་ཨིན་ན་ ཞིབ་དཔྱད་འབདཝ་ཨིན།
བརྡ་སྟོན་: ད་ལྟོ་པར་བཏབ་ཡོད་པའི་ཡིག་འབྲུ་གུ་གཞི་ཁྲམ་ཅིག་སྤོ་བཤུད་འབད་ནི་ལུ་ ཨེན་ཀོར་གནས་ས་དང་གཅིག་ཁར་ བཤུད་སྒྲིལ་གནས་སྟངས་འདྲི་དཔྱད་ཚུ་ལག་ལེན་འཐབ་མི་ པོ་ཀེ་མཱོན་བརྗོད་དོན་ཐོ་ཡིག།
རྣམ་གྲངས་ག་འདི་ སི་ཨེསི་ཨེསི་དང་གཅིག་ཁར་ བརྡུང་ཡོདཔ་ཨིན་ན་ བརྟག་ཞིབ་འབད་ནི་ལུ་ པེན་བཤུད་-གནས་སྟངས་འདྲི་དཔྱད་འདི་བལྟ། ལེགས་བཅོས་འབད་ཡོད་པའི་ ལཱ་གཡོག་རིག་པ་: སི་ཨེསི་ཨེསི་ནང་ ཚད་མ། ང་བཅས་རའི་ལཱ་གི་རྒྱུན་རིམ་ཚུ་ མཐོང་སྣང་ཅན་བཟོ་མི་ ཁྱད་རྣམ་ཚུ་ གསལ་སྟོན་འབདཝ་ཨིན། ང་བཅས་ཀྱིས་ཚད་མ་འདི་ག་དེ་སྦེ་འབྲིཝ་ཨིན་ན་ ཁྱད་རྣམ་གསུམ་འདི་ བསྒྱུར་བཅོས་འབད་ཚུགསཔ་ཨིན།
if() Statementsང་བཅས་ཀྱིས་ མཐའ་མཇུག་ལུ་ CSS ནང་ལུ་ གནས་སྟངས་ཚུ་ཐོབ་དོ་ཡོདཔ་ཨིན། if() ལས་འགན་འདི་གིས་ བཟོ་རྣམ་ཤོག་ལེབ་ཚུ་གི་དོན་ལུ་ གསུམ་ལྡན་བཀོལ་སྤྱོད་པ་བཟུམ་སྦེ་ལཱ་འབདཝ་ཨིན། འདི་གིས་རྒྱུ་དངོས་བསྒྱུར་བཅོས་རྐྱང་པ་གི་དོན་ལུ་ verbose @media སྡེབ་ཚན་ཚུ་གི་དགོས་མཁོ་མར་ཕབ་འབདཝ་ཨིན། @function functionsང་བཅས་ཀྱིས་ མཐའ་མཇུག་ལུ་ ཚད་མ་ལ་ལོ་ཅིག་ ས་གནས་སོ་སོ་ཅིག་ནང་ སྤོ་བཤུད་འབད་ཚུགས། sibling-index() དང་ sibling-count()འ་ནི་ཤིང་གྱངས་ཁ་བརྐྱབ་ནིའི་ལས་འགན་ཚུ་གིས་ ཐོ་ཡིག་ཚད་ལུ་གཞི་བཞག་སྟེ་ བསྒུལ་བཟོ་ཚུ་ ཡང་ན་ རྣམ་གྲངས་ཚུ་ བཟོ་རྣམ་བཟོ་ནི་གི་གནད་དོན་འདི་སེལ་འཐུ་འབདཝ་ཨིན། ང་གིས་ སི་ཨེསི་ཨེསི་དང་གཅིག་ཁར་ སྤུན་ཆ་ཚུ་ བཟོ་རྣམ་བཟོ་ནི་འདི་ འཇམ་ཏོང་ཏོ་ཅིག་མེན་པས། འདི་གིས་ ང་བཅས་རའི་ཨེཆ་ཊི་ཨེམ་ཨེལ་ནང་ལུ་ ཧརཌ་ཀོཌ་སྲོལ་སྒྲིག་རྒྱུ་དངོས་ཚུ་ ༼ --index: ༡ བཟུམ་༽ དགོཔ་མེདཔ་བཟོཝ་ཨིན།
དཔེར་ན་: སྒྲིག་བཀོད་ཚུ་རྩིས་སྟོན་དོ། ད་ལྟོ་ང་བཅས་ཀྱིས་ ཨང་རྩིས་ཐབས་གཞི་ཚུ་ བསྡུས་བསྡུས་སྦེ་བྲིས་ཚུགས། དཔེར་ན་ གསལ་གཞི་ནང་འཛུལ་མི་ཤོག་བྱང་ཚུ་གི་དོན་ལུ་ བསྒུལ་བཟོ་ཅིག་ གཡོ་སྒྱུ་འབད་ནི་འདི་ ཁག་ཆེཝ་ཅིག་ལུ་འགྱུརཝ་ཨིན། .ཤོག་བྱང་-སྣོད > * { . བསྒུལ་བཟོ་: 0.6s འཇམ་ཏོང་ཏོ་-ཕྱིར་ཐོན་གདོང་ཕྱོགས་ཚུ་གསལ་སྟོན་འབད། /* ལག་ཐོག་ --ཟུར་ཐོ་འགྱུར་ཅན་ཚུ་ ད་ལས་ཕར་མེདཔ་! */ བསྒུལ་བཟོ་-ཕྱིར་འགྱངས་: ཀེལཀ་(སྤུན་ཆ་-ཟུར་ཐོ་() * ༠.༡s); } .
ང་ཡང་ འ་ནི་ལས་འགན་ཚུ་ ཟུར་གསུམ་རྩིས་རིག་དང་གཅིག་ཁར་ ལག་ལེན་འཐབ་སྟེ་ ཅ་བ་ཚུ་ ཇ་བ་ཨིསི་ཀིརིཔཊི་མེད་པར་ སྒོར་ཐིག་ཡང་དག་ཅིག་ནང་ བཙུགས་ནིའི་དོན་ལུ་ བརྟག་དཔྱད་འབད་ཡི།
བརྡ་སྟོན་: ཤོག་བྱང་བསྒུལ་བཟོ་ཚུ་ མགྱོགས་དྲགས་སྦེ་ གཡོ་སྒྱུ་འབད་དོ།
utilitybend གིས་ sibling-index() [forked] ལག་ལེན་འཐབ་སྟེ་ པེན་སི་ཊེག་གར་ཤོག་བྱང་ཚུ་བལྟ།
བརྡ་སྟོན་: རྣམ་གྲངས་ཚུ་ སྤུན་ཆ་-ཟུར་ཐོ་ སྤུན་ཆ་-གྱངས་ཁ་ དེ་ལས་ སི་ཨེསི་ཨེསི་ @function ཁྱད་རྣམ་གསརཔ་ལག་ལེན་འཐབ་ཐོག་ལས་ སྒོར་ཐིག་ཡང་དག་ཅིག་ནང་བཙུགས་དོ།
See Pen སྒོར་ཐིག་འདི་ སྤུན་ཆ་-ཟུར་ཐོ་དང་ སྤུན་ཆ་-གྱངས་ཁ་ དེ་ལས་ ལས་འགན་ཚུ་ [forked] གིས་ utilitybend གིས་ལག་ལེན་འཐབ་ཨིན། ངའི་སི་ཨེསི་ཨེསི་འབད་དགོ་པའི་ཐོ་ཡིག: ང་གིས་ འབད་རྩོལ་བསྐྱེད་ནི་ལུ་སྒུག་མ་ཚུགས་པའི་ཁྱད་རྣམ་ཚུ། འདོན་སྤེལ།: ༢༠༡༠/༠༣/༠༣ རིག་པ།(༠) འདི་ཡང་ གཟའ་ཉི་མའི་ཉིན། འདི་ཚུ་ ངེ་གི་ཤུལ་མའི་བརྟག་དཔྱད་ཚུ་གི་དོན་ལུ་ ངེ་གི་ཐོ་ཡིག་ནང་ མཐོ་དྲགས་སྦེ་ཡོདཔ་ཨིན། ཨེན་ཀོར་འབད་ཡོད་པའི་ དོས་ཆས་འདྲི་དཔྱད་ཚུ། ང་གིས་ ངེ་གི་ ཀ་རུ་སེལ་ བརྡ་སྟོན་ནང་ ཨེབ་རྟ་ཚུ་གི་དོན་ལུ་ སི་ཨེསི་ཨེསི་ ཨེན་ཀོར་གནས་ས་ལག་ལེན་འཐབ་ཡོདཔ་ཨིན་རུང་ “སི་ཨེསི་ཨེསི་ བཀབ་ཡོདཔ་” གིས་ འོད་རྟགས་བཀལཝ་ཨིན།evolution of this: གཞི་བཙུགས་འབད་ཡོད་པའི་ དོས་ཆས་འདྲི་དཔྱད་ཚུ། འདི་གིས་ ང་བཅས་ཆ་ཁྱབ་ཀྱིས་ ལག་ཆས་བརྡ་དོན་ཚུ་དང་གཅིག་ཁར་ དཀའ་ངལ་སེལ་ཚུགསཔ་ཨིན། བརྡ་འཚོལ་འདི་གིས་ ས་སྟོང་མེད་པའི་དབང་གིས་ ལག་ཆས་བརྡ་དོན་འདི་ མགུ་ལས་མཇུག་ཚུན་ཚོད་ བསྒྱིར་བ་ཅིན་ “མདའ་རྟགས་” འདི་ འཕྲལ་འཕྲལ་རང་ ལམ་འཛོལ་བ་སྦེ་ བརྡ་སྟོན་འབདཝ་ཨིན། ཨེན་ཀོར་འབད་ཡོད་པའི་ དོས་ཆས་འདྲི་དཔྱད་ཚུ་དང་གཅིག་ཁར་ (@container anchored(fallback: flip-block)) ང་བཅས་ཀྱིས་ བརྡ་འཚོལ་འདི་གིས་ ངོ་མ་སྦེ་གདམ་ཁ་རྐྱབ་མི་ ཕོལབེཀ་གནས་ས་ག་ཅི་ལུ་གཞི་བཞག་སྟེ་ ཡན་ལག་འདི་བཟོ་རྣམ་བཟོ་ཚུགས། ནང་འཁོད་མཐོང་སྣང་ འགྱུར་བའི་སྡེ་ཚན་ཚུ། མཐོང་སྣང་འགྱུར་བ་འདི་ གཞི་སྒྱུར་ཅིག་ཨིན་རུང་ ཁོང་ཆ་ཁྱབ་ དམིགས་བསལ་གྱི་ཚོང་འབྲེལ་གྱི་ཐོག་ལས་འོང་ཡོདཔ་ཨིན། ཁོང་གིས་ འབྱུང་བ་ཤིང་འདི་ ལེབ་ཏེག་ཏེ་བཟོ་ཡོདཔ་དང་ འདི་གིས་ འཕྲལ་འཕྲལ་སྐབས་ ༣ཌི་བསྒྱུར་བཅོས་དང་ ཡང་ན་ འཕྱེལ་འགྱོ་མི་: བཤུད་བརྙན། ང་གིས་ དུས་རྒྱུན་དུ་ ག་ཅི་ཅིག་ མ་ཐོབ་པའི་ ཚོར་སྣང་བྱུང་ཡོདཔ་ལས་ འདི་ཡང་ ལན་རྐྱངམ་གཅིག་འོང་ནི་མས། view-transition-group: ཉེ་འདབས་ལག་ལེན་འཐབ་ཐོག་ལས་ མཐའ་མཇུག་ཁར་ ང་བཅས་ཀྱིས་ གཅིག་གིས་གཅིག་གི་ནང་འཁོད་ལུ་ འགྱུར་བའི་སྡེ་ཚན་ཚུ་ བཙུགས་ཚུགས། འདི་གིས་ ང་བཅས་ལུ་ འགྱུར་བ་གི་སྐབས་ལུ་ བཏོག་བཏང་ནི་གི་ནུས་པ་དང་ ཡང་ན་ ༣ཌི་བསྒྱིར་ནི་ཚུ་ བདག་འཛིན་འཐབ་བཅུགཔ་ཨིན། .ཤོག་བྱང་ img { . view-བསྒྱུར་བཅོས་-མིང་: པར་རིས།; མཐོང་སྣང་-བསྒྱུར་བཅོས་-སྡེ་ཚན་: ཉེ་འདབས་; /* འདི་ནང་བཙུགས་བཞག! */ } .
དཔེ་སྐྲུན་དང་དབྱིབས། འདོན་སྤེལ།: ༢༠༡༠/༠༣/༠༣ རིག་པ།(༠) འདི་ཡང་ གཟའ་ཉི་མའི་ཉིན། དེ་ལས་ གསར་བསྐྲུན་གྱི་ཕྱོགས་ལུ་ ཟུར་ཁའི་དབྱིབས་དང་ དབྱིབས་() ལས་འགན་འདི་གིས་ གྲུ་བཞི་མེན་པའི་སྒྲིག་བཀོད་ཚུ་ཁ་ཕྱེ་སྟེ་ “squaricles” དང་ CSS འགྱུར་ཅན་ཚུ་ལུ་ལན་གསལ་འབད་མི་ མགུ་རྙོག་དྲགས་ཀྱི་འགྲུལ་ལམ་ཚུ་ འབད་བཅུགཔ་ཨིན། འདི་ཡང་ ང་གིས་ བཟོ་བཀོད་འདི་ མཆོད་རྟེན་ཚུ་གིས་ གང་སྟེ་ཡོདཔ་ལས་ བསྒུག་མི་ཚུགས། རེ་བ་ཅན་གྱི་མ་འོངས་པ། ང་བཅས་ཀྱིས་ ཧེ་མ་ ཇ་བ་ཨིསི་ཀིརིཔཊི་གི་ ཚད་མ་དང་ གནས་སྟངས་ དེ་ལས་ མགུ་རྙོག་དྲགས་ཀྱི་འབྲེལ་བ་ཚུ་ འཛིན་སྐྱོང་འཐབ་ཚུགས་པའི་ འཛམ་གླིང་ཅིག་ མཐོང་དོ་ཡོདཔ་ཨིན། moveBefore བཟུམ་གྱི་ཁྱད་རྣམ་ཚུ་ (iframes/videos གི་དོན་ལུ་ DOM གནས་སྟངས་ཉམས་སྲུང་འབད་ནི་) དང་ attr() (ཚོས་གཞི་དང་གིརིཌི་ཚུ་གི་དོན་ལུ་ ཡིག་རྒྱུན་ལས་ལྷག་པའི་དབྱེ་བ་ཚུ་ལག་ལེན་འཐབ་སྟེ་) འདི་གིས་ དངོས་གནས་འདི་ ལྷག་པར་དུ་ བརྟན་ཏོག་ཏོ་བཟོཝ་ཨིན། ད་ལྟོ་ཁྱད་རྣམ་འདི་ཚུ་ལ་ལུ་ཅིག་ བརྟག་དཔྱད་ཡང་ན་ ཀོརོམ་ལུ་དམིགས་བསལ་སྦེ་ཡོད་རུང་ འཕེལ་ཤུགས་འདི་ ངོས་ལེན་འབད་མ་ཚུགསཔ་ཨིན། ང་བཅས་ཀྱིས་ འ་ནི་ལྕོགས་གྲུབ་ཚུ་ གཞི་རྟེན་ཅིག་ལུ་འགྱུར་བཅུག་ནིའི་དོན་ལུ་ ཨིན་ཊར་ཨོཔ་བཟུམ་གྱི་ ལས་རིམ་ཚུ་གི་ཐོག་ལས་ བརྡ་འཚོལ་ཆ་མཉམ་ནང་ རྒྱབ་སྐྱོར་འཕྲོ་མཐུད་དེ་རང་ འབད་ནི་གི་རེ་བ་བསྐྱེད་དགོ། འདི་ཡང་ བརྡ་འཚོལ་འཕྲུལ་ཆས་ཚུ་ “Chrome first” ནང་ལུ་ ཁྱད་རྣམ་འདི་ཚུ་ག་ར་ཡོད་མི་བཟུམ་སྦེ་ ཁག་ཆེ་ཟེར་ཨིན་མས། འ་ནི་ཁྱད་རྣམ་གསརཔ་ཚུ་ བརྡ་འཚོལ་ནང་ མ་ལྷོད་པའི་ཧེ་མ་ གྲོས་བསྟུན་འབད་དགོཔ་དང་ བརྡུང་རྫོབ་འབད་དགོཔ་ དེ་ལས་ བརྟག་དཔྱད་འབད་དགོཔ་ཨིན། འདི་ CSS ནང་ལུ་འཛུལ་ནིའི་དོན་ལུ་ དུས་ཚོད་ཡ་མཚན་ཅན་ཅིག་ཨིན། ང་བཅས་ཡིག་ཆ་ཚུ་བཟོ་རྣམ་རྐྱངམ་ཅིག་མེན། ང་བཅས་ཀྱིས་ ཧེ་མ་ལས་ལྷག་སྟེ་ སྟོབས་ཤུགས་ཅན་གྱི་ ས་གནས་ཀྱི་ལག་ཆས་ཆ་ཚང་ཅིག་དང་གཅིག་ཁར་ ཕན་ནུས་ཅན་དང་ ལཱ་འབད་ཐངས་ དེ་ལས་ ཤུགས་ཅན་གྱི་ལག་ལེན་ཚུ་ བཟོ་བསྐྲུན་འབད་དོ་ཡོདཔ་ཨིན། དུས་རབས་གསརཔ་འདི་དང་གཅིག་ཁར་ འགྱོ་སྟེ་ ཁྱབ་སྤེལ་འབད་གེ། འདི་ CSS བཀབ་ཡོདཔ་ཨིན་!