ऑडियो और वीडियो नियंत्रण में ठहराव प्रतीक के लिए HTML


97

मैं एक बटन को यूनिकोड पॉज़ प्रतीक प्रदर्शित करने के लिए यूनिकोड प्रतीक खोजने की कोशिश कर रहा हूं। मैं यह पता लगाने में सक्षम था कि यूनिकोड प्ले सिंबल है, &#9658लेकिन मैं यूनिकोड पॉज़ प्रतीक के बराबर देख रहा हूं।


1
यह वही सवाल था, लेकिन एक "स्टॉप" बटन (वर्ग) के लिए। इसके लिए रोको का जवाब सबसे अच्छा था।
१६:४६ पर स्टर्मांडेलिक

जवाबों:


105

विभिन्न प्रतीक हैं जिन्हें पर्याप्त प्रतिस्थापन माना जा सकता है, जिनमें शामिल हैं:

  1. | | - दो मानक (बोल्ड) ऊर्ध्वाधर बार।

  2. Another - ▋और एक अन्य▋

  3. Another - ▌और एक अन्य▌

  4. Another - ▍और एक अन्य▍

  5. Another - ▎और एक अन्य▎

  6. Another - ❚और एक अन्य❚

मैं एक या दो को मिस कर सकता हूं, लेकिन मुझे लगता है कि ये बेहतर हैं। यहाँ सिर्फ मामले में प्रतीकों की एक सूची है


मैंने इसका इस्तेमाल किया: 𝍪
जोशुआ

& # 9646; HTML में असली ठहराव प्रतीक है।
Fla

@ JoshuaD यदि आप कई ब्राउज़रों का समर्थन करना चाहते हैं, तो आपको शायद उस एक का उपयोग नहीं करना चाहिए। मैं नवीनतम फ़ायरफ़ॉक्स का उपयोग कर रहा हूं और यह पठनीय नहीं है।
भगवान का बच्चा

3
मैंने =साथ दिया transform:rotate(90deg);
जो डीएफ

1
@AChildofGod - यह (केवल) ब्राउज़र के बारे में नहीं है, यह आपकी मशीन पर स्थापित फोंट पर निर्भर करता है।
कुब्बी

173

मीडिया नियंत्रण प्रतीकों के लिए यूनिकोड मानक

ठहराव: ⏸︎

यूनिकोड स्टैंडर्ड 13.0 (अद्यतन 2020) प्रदान करता है विविध तकनीकी हेक्स रेंज में ग्लिफ़ 2300-23FF

विविध तकनीकी

व्यापक यूनिकोड 13.0 प्रलेखन को देखते हुए , कुछ ग्लिफ़ जिन्हें हम आम मीडिया नियंत्रण प्रतीकों से जोड़ सकते हैं, निम्नलिखित हैं:

कीबोर्ड और यूआई प्रतीक

23CF। मीडिया को बाहर निकालें

उपयोगकर्ता इंटरफ़ेस प्रतीक

23E9 E फास्ट फॉरवर्ड
23EA 9 रिवाइंड, फास्ट बैकवर्ड
23EB ⏩︎ फास्ट वृद्धि
23EC ⏭︎ फास्ट कमी
23ED ⏩︎ एंड टू एंड, नेक्स्ट
23EE ⏮︎ स्किप टू स्टार्ट, पिछला
23EF / प्ले / पॉज टॉगल
23F1 ⏱︎ स्टॉपवॉच
23F2 ⏲︎ टाइमर क्लॉक
23F3 ⏳︎ प्रति घंटा
23F4 ⏩︎ ︎ रिवर्स, बैक
23F5, आगे, अगला,
23F6 F 23F7 बढ़ाएं
23 23F8 घटाएं
⏸︎ 23F9 रोकें
FA
23FA 23 रिकॉर्ड रोकें

आईएसओ 7000 से पावर सिंबल: 2012

23FB F स्टैंडबाय / पावर
23FC / पावर ऑन / ऑफ
23FD 2 पावर ऑन
2B58 ⏻︎ पावर ऑफ

IEEE 1621-2004 से पावर सिंबल

23FE ⏾︎ शक्ति नींद

वेब पर उपयोग करें:

पार्सर को बाइट्स को सही ढंग से कैसे बदलना है, यह निर्देश देने के लिए बीओएम के बिना यूटीएफ -8 एन्कोडिंग का उपयोग करके एक फ़ाइल को बीओएम (जो कि ज्यादातर विकास के वातावरण में डिफ़ॉल्ट रूप से सेट किया गया है) को सहेजना चाहिए । HTML फ़ाइल में <meta charset="utf-8"/>तुरंत बाद उपयोग किया जाना चाहिए , और सुनिश्चित करें कि सही HTTP हेडर सेट हैं।<head>Content-Type: text/html; charset=utf-8

उदाहरण:

एचटीएमएल
&#x23E9; Pictograph 
&#x23E9;&#xFE0E; Standardized Variant
सीएसएस
.icon-ff:before { content: "\23E9" }
.icon-ff--standard:before { content: "\23E9\FE0E" }
जावास्क्रिप्ट
EL_iconFF.textContent = "\u23E9";
EL_iconFF_standard.textContent = "\u23E9\uFE0E"

मानकीकृत संस्करण

किया जा रहा से एक ग्लिफ़ को रोकने के लिए "रंग-emojified" ⏩︎ / ⏩ संलग्न कोड U + FE0E पाठ प्रस्तुति चयनकर्ता एक अनुरोध करने के लिए मानकीकृत संस्करण : (उदाहरण: &#x23e9;&#xfe0e;)

विसंगतियों

यूनिकोड श्रेणी में वर्ण फ़ॉन्ट परिवार के वातावरण के लिए अतिसंवेदनशील होते हैं, जिनका उपयोग किया जाता है, अनुप्रयोग, ब्राउज़र, OS, प्लेटफ़ॉर्म।
जब अज्ञात या गुम हो जाता है - हम विभिन्न विक्रेताओं द्वारा HTML पार्सर कार्यान्वयन में अंतर के कारण or या or के बजाय प्रतीक, या यहां तक ​​कि असंगत व्यवहार देख सकते हैं ।
उदाहरण के लिए, विंडोज क्रोमियम ब्राउज़रों पर मानकीकृत वेरिएंट प्रत्यय U + FE0E छोटी गाड़ी है, और इस तरह के प्रतीक अभी भी सीएसएस के साथ बेहतर हैं: यानी font-family: "Segoe UI Symbol"रंगीन इमोजी के ऊपर उस विशिष्ट फ़ॉन्ट को मजबूर करने के लिए (जिसे आमतौर पर "सेगो यूआई इमोजी" के रूप में पहचाना जाता है) - जो कि ख़राब करता है पहली बार में U + FE0E का उद्देश्य - समय बताएगा ...


स्केलेबल आइकन फ़ॉन्ट

असमर्थित वर्णों से संबंधित समस्याओं को दरकिनार करने के लिए - एक व्यवहार्य समाधान स्केलेबल आइकन फ़ॉन्ट-सेट का उपयोग करना है जैसे:

बहुत बढ़िया फ़ॉन्ट

प्लेयर आइकन - स्केलेबल - फ़ॉन्ट भयानक

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<i class="fa fa-arrows-alt"></i>
<i class="fa fa-backward"></i>
<i class="fa fa-compress"></i>
<i class="fa fa-eject"></i>
<i class="fa fa-expand"></i>
<i class="fa fa-fast-backward"></i>
<i class="fa fa-fast-forward"></i>
<i class="fa fa-forward"></i>
<i class="fa fa-pause"></i>
<i class="fa fa-play"></i>
<i class="fa fa-play-circle"></i>
<i class="fa fa-play-circle-o"></i>
<i class="fa fa-step-backward"></i>
<i class="fa fa-step-forward"></i>
<i class="fa fa-stop"></i>
<i class="fa fa-youtube-play"></i>

Google प्रतीक

यहां छवि विवरण दर्ज करें

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<i class="material-icons">pause</i>
<i class="material-icons">pause_circle_filled</i>
<i class="material-icons">pause_circle_outline</i>
<i class="material-icons">fast_forward</i>
<i class="material-icons">fast_rewind</i>
<i class="material-icons">fiber_manual_record</i>
<i class="material-icons">play_arrow</i>
<i class="material-icons">play_circle_filled</i>
<i class="material-icons">play_circle_outline</i>
<i class="material-icons">skip_next</i>
<i class="material-icons">skip_previous</i>
<i class="material-icons">replay</i>
<i class="material-icons">repeat</i>
<i class="material-icons">stop</i>
<i class="material-icons">loop</i>
<i class="material-icons">mic</i>
<i class="material-icons">volume_up</i>
<i class="material-icons">volume_down</i>
<i class="material-icons">volume_mute</i>
<i class="material-icons">volume_off</i>

और कई अन्य आप जंगली में पा सकते हैं; और अंतिम लेकिन कम से कम, यह वास्तव में उपयोगी ऑनलाइन टूल: फ़ॉन्ट-आइकन जनरेटर, Icomoon.io



2
धन्यवाद दोस्त, वास्तव में उपयोगी उत्तर।
डैनियल बर्डे

1
Google फॉन्ट / आइकन्स में अनायास कोई "सर्किल स्टॉप" बटन नहीं है, इसलिए उनका "सर्किल प्ले" और "सर्किल पॉज़" सेट अधूरा है ...
Fizz


विस्मयकारी उत्तर - मुझे उस प्रयास से प्यार है जो इसमें डाला गया था। क्या आपने आधिकारिक "आईएसओ 7000 / IEC 60417 प्रतीक चिन्ह को थामने के लिए ध्यान दिया? रुकावट # 5111B है। देखें Media_Controls", जिसे इस रेखांकित जवाब में @intotecho ने इंगित किया था? → stackoverflow.com/a/48918561/4575793
Cadoiz

57

निम्नलिखित काम आ सकते हैं:

  • &#x23e9;
  • &#x23ea;
  • &#x24eb;
  • &#x23ec;
  • &#x23ed;
  • &#x23ee;
  • &#x23ef;
  • &#x23f4;
  • &#x23f5;
  • &#x23f6;
  • &#x23f7;
  • &#x23f8;
  • &#x23f9;
  • &#x23fa;

नोट : जाहिरा तौर पर, ये वर्ण लोकप्रिय फोंट में बहुत अच्छी तरह से समर्थित नहीं हैं, इसलिए यदि आप इसे वेब पर उपयोग करने की योजना बनाते हैं, तो इनका समर्थन करने वाले वेबफॉन्ट को चुनना सुनिश्चित करें।



22

मैंने पाया, यह विविध तकनीकी ब्लॉक में है। 23 (U + 23F8)


3
यकीन नहीं होता कि कैसे सही जवाब मिला। नीचे लिंक देखें जहां यह "डबल वर्टिकल बार" भी अपनी टिप्पणियों में "ठहराव" के रूप में विख्यात है। बहुत बुरा यह फोंट में अच्छी तरह से समर्थित नहीं लगता है (जून 2014 में यूनिकोड में जोड़ा गया)। fileformat.info/info/unicode/char/23f8/index.htm
अनम


5

यदि आप चाहते हैं कि "प्ले" के लिए राइट-फेसिंग त्रिकोण से मेल खाने वाला एक एकल पात्र हो, तो रोमन अंक 2 का प्रयास करें। Ⅱ &#8545;HTML में है। यदि आप इसके चारों ओर फ़ॉर्मेटिंग टैग लगा सकते हैं, तो यह बोल्ड में बहुत अच्छा लगता है। है <b>&#8545;</b>HTML में। पहले से उल्लेखित डबल वर्टिकल बार की तुलना में इसका बेहतर समर्थन है।


मुझे खुशी है कि आपने इसे साहसिक बनाने का उल्लेख किया। मैं & # 2405 का उपयोग कर रहा हूं; और यह बोल्ड में बेहतर दिखता है।
efreed

5

आधुनिक ब्राउज़र 'DOUBLE VERTICAL BAR' (U + 23F8) का भी समर्थन करते हैं:

http://www.fileformat.info/info/unicode/char/23f8/index.htm

एक संगीत खिलाड़ी के लिए यह 'ब्लैक राइट-पोस्टिंग पोस्टर' (U + 25BA) के लिए एक साथी के रूप में कार्य कर सकता है क्योंकि वे दोनों समान चौड़ाई और ऊंचाई साझा करते हैं, जो इसे एक नाटक / ठहराव बटन के लिए एकदम सही बनाता है:

http://www.fileformat.info/info/unicode/char/25ba/index.htm


1
मैक पर डबल वर्टिकल बार एक स्क्यूओमॉर्फिक बॉक्स से घिरा होता है जो ब्लैक राइट-पॉइंटिंग पॉइंटर से अलग दिखता है।
विल

2

ठहराव प्रतीक के रूप में उपयोग के लिए एन्कोडेड कोई वर्ण नहीं है, हालांकि विभिन्न वर्ण या वर्णों का संयोजन फ़ॉन्ट के आधार पर, ठहराव प्रतीक की तरह कम या ज्यादा लग सकता है।

2005 में सार्वजनिक यूनिकोड मेलिंग सूची में एक चर्चा में, U + 275A HEAVY VERTICAL BAR चरित्र: ❚❚ की दो प्रतियों का उपयोग करने का सुझाव दिया गया था। लेकिन परिणाम की पर्याप्तता फ़ॉन्ट पर निर्भर करती है; उदाहरण के लिए, ग्लिफ़ को डिज़ाइन किया गया होगा ताकि बार बहुत अधिक अलग हो जाएं। - सूची चर्चा बताती है कि एक ठहराव प्रतीक को क्यों नहीं कूटा गया था, और यह नहीं बदला है।

इस प्रकार, एक छवि का उपयोग करने के लिए सबसे अच्छा विकल्प है। यदि आपको पाठ में प्रतीक का उपयोग करने की आवश्यकता है, तो इसे उपयुक्त रूप से बड़े आकार में बनाना (60 पिक्सेल से 60 कहना) और इसे सीएसएस के साथ पाठ आकार में मापना सबसे अच्छा है (जैसे, तत्व height: 0.8emपर सेटिंग img)।


आप कुछ सीएसएस जैसे "लेटर-स्पेसिंग: -6px" को डबल हैवी वर्टिकल बार में भी जोड़ सकते हैं, इसलिए यह एक वास्तविक पॉज़ सिंबल की तरह दिखता है। उदाहरण: jsfiddle.net/enKaA
JaGo

यह # 9616 से बेहतर है क्योंकि यह समान ऊंचाई है।
अराम कोचरन

2
यह उत्तर अप्रचलित है। यूनिकोड 7.0 (जारी की 2014) U + 23F8 और मिलान प्रतीकों (नाटक, बंद करो, रिकॉर्ड) जोड़ा गया है ठीक इस उद्देश्य के लिए unicode.org/charts/PDF/Unicode-7.0/U70-2300.pdf
सीटी

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.