- Text Fragment एक शक्तिशाली web platform फीचर है, जो anchor जोड़े बिना web page के भीतर किसी खास text से सटीक रूप से लिंक करने देता है
- इस फीचर को
::target-text CSS pseudo-element पूरा करता है, जो highlighted text की styling तय करने का तरीका देता है
- Text Fragment URL का मूल syntax:
- hash symbol के बाद
:~: विशेष syntax जोड़ें, और text= के बाद यह जोड़ें:
prefix-: वह text string जो लिंक किए गए text के ठीक पहले आनी चाहिए। जब कई matching items हों, तो यह browser को सही text से लिंक करने में मदद करती है। यह हिस्सा highlight नहीं होता
textStart: highlight किए जाने वाले text की शुरुआत
textEnd: highlight किए जाने वाले text का अंतिम हिस्सा
-suffix: यह prefix- की तरह काम करता है, लेकिन text के बाद आने वाली text string के लिए होता है। कई matching items होने पर उपयोगी है, और यह linked text के साथ highlight नहीं होता
- अगर browser text fragment को support करता है, तो
::target-text pseudo-element का उपयोग करके highlighted text की styling बदली जा सकती है
::target-text { background-color: yellow; }
- केवल ये properties बदली जा सकती हैं:
- color
- background-color
- text-decoration और उससे संबंधित properties
- text-shadow
- stroke-color, fill-color, stroke-width
- custom properties
- browser support और fallback behavior
- text fragment फिलहाल सभी browsers में supported है
::target-text pseudo-element अभी Safari में supported नहीं है, लेकिन Technology Preview version में उपलब्ध है
- अगर browser इस फीचर को support नहीं करता, तो page बिना text highlighting या scrolling के load होगा
- highlighting की default styling browser के अनुसार अलग होती है
- अंतिम विचार
- शुरू में लगा था कि text fragment Chrome-only फीचर है, लेकिन बाद में समझ आया कि यह वास्तव में एक open web standard है जिसे सभी browsers implement कर सकते हैं
- खासकर भरोसेमंद generative AI systems में इस फीचर का और व्यापक उपयोग देखना चाहूँगा
- अच्छा होगा अगर सभी users text fragments को आसानी से इस्तेमाल कर सकें
- अपडेट
- Chromium-आधारित browsers में किसी खास text के लिए link बनाने का फीचर पहले से built-in है
- अगर आप Chrome इस्तेमाल कर रहे हैं, तो text को highlight करके right-click करें; context menu में आपको "Copy link to highlight" विकल्प मिलेगा
7 टिप्पणियां
कभी-कभी Google Search करते समय यह देखा था, तो यह वही चीज़ है।
ओह, Arc Browser में "Copy link to text" के तौर पर कॉपी होने वाली चीज़ यही फीचर थी..!
Edge browser में जब टेक्स्ट select करके right-click context menu खोलते हैं, तो वहाँ
Copy link to highlightनाम का एक मेनू होता है, और उसी फीचर की वजह से मुझे पता चला था कि ऐसा एक spec भी मौजूद है।Firefox में मैं
https://github.com/ichaoX/ext-textFragmentनाम का extension install करके इस्तेमाल कर रहा/रही हूँ।ओह, अच्छा extension है, धन्यवाद।
ओह, यह काफ़ी दिलचस्प है।
ऐसा फीचर भी है.... ब्राउज़र की दुनिया को जितना जानो, उतनी ही तरह-तरह की चीज़ें मिलती हैं.
https://hi.news.hada.io/topic?id=17474#:~:text=cheoeumeneun,kkaedareum