WebKit क्या है और यह CSS से कैसे संबंधित है?

Question

हाल ही में, मैं "वेबकिट" टैग के साथ प्रश्न देख रहा हूं। इस तरह के सवाल आमतौर पर CSS, jQuery, लेआउट, क्रॉस-ब्रोवर्स कम्पैटिबिलिटी इश्यू आदि से संबंधित वेब आधारित प्रश्न होते हैं ...

तो यह "वेबकिट" क्या है और यह सीएसएस से कैसे संबंधित है? मैंने -webkit-...विभिन्न वेबसाइटों के लिए स्रोत कोड में बहुत सारी संपत्तियों पर भी ध्यान दिया है । क्या ये दोनों संबंधित हैं?

अपडेट करें

अब तक के जवाबों से ... WebKit एक HTML / CSS वेब ब्राउज़र है जो सफारी / क्रोम के लिए रेंडरिंग इंजन है। क्या IE / ओपेरा / फ़ायरफ़ॉक्स के लिए ऐसे इंजन हैं और एक के बाद एक का उपयोग करने के मतभेद, पेशेवरों और विपक्ष क्या हैं? क्या मैं उदाहरण के लिए फ़ायरफ़ॉक्स में WebKit सुविधाओं का उपयोग कर सकता हूं?

अंतिम सवाल ... क्या IE द्वारा WebKit का समर्थन किया गया है?

अपडेट २

सभी प्रमुख ब्राउज़र विभिन्न रेंडरिंग इंजनों का उपयोग करते हैं। मुझे लगता है कि यह एक बड़ा कारण है कि इतने सारे क्रॉस-ब्राउज़र संगतता मुद्दे हैं!

तो, क्या मानक रेंडरिंग इंजन के लिए किसी प्रकार की परियोजना या आंदोलन है जो सभी ब्राउज़र उपयोग करेंगे? क्या HTML5 क्रॉस-ब्राउज़र संगतता समस्याओं का अंत लाएगा?

Comments

आपका अंतिम प्रश्न प्रभावी रूप से "क्या IE को उन चीजों को प्रस्तुत करने के लिए कहा जा सकता है जिन्हें इसे प्रस्तुत करने के लिए क्रमादेशित नहीं किया गया है?", और उत्तर है

— गैरेथ

फायरफॉक्स के रेंडरिंग इंजन को जेको कहा जाता है। अर्थात् अपने स्वयं के इंजन इंजन का उपयोग करता है।

— troelskn

@ गारेथ ... धन्यवाद। यह वही है जो मैं नहीं सुनने की उम्मीद कर रहा था :) इस मामले में, मुझे आशा है कि IE जल्द ही संगत हो सकता है ... और यह कि लोग IE6 का उपयोग करना बंद कर देते हैं!

— हिस्टो

CSS के माध्यम से IE में जोड़े गए कुछ वेबकिट कार्यक्षमता के लिए css3pie.com देखें ।

— Kenoyer130

WebKit सबसे खराब HTML रेंडरिंग इंजन है, बार कोई नहीं। NWA को उद्धृत करने के लिए बुरा अर्थ बुरा नहीं है, लेकिन बुरा अर्थ अच्छा है।

— डग नबबिट

Answer 1

अद्यतन: तो जाहिरा तौर पर, WebKit एक HTML / CSS वेब ब्राउज़र है जो सफारी / क्रोम के लिए रेंडरिंग इंजन है। क्या IE / ओपेरा / फ़ायरफ़ॉक्स के लिए ऐसे इंजन हैं और एक के बाद एक का उपयोग करने के मतभेद, पेशेवरों और विपक्ष क्या हैं? क्या मैं उदाहरण के लिए फ़ायरफ़ॉक्स में WebKit सुविधाओं का उपयोग कर सकता हूं?

प्रत्येक ब्राउज़र HTML / CSS वेब पेज को खींचने के लिए एक रेंडरिंग इंजन द्वारा समर्थित है।

• IE → त्रिशूल (बंद)
• बढ़त → EdgeHTML (ट्राइडेंट का साफ-अप कांटा)(एज 2019 में पलक झपकते हुए)
• फ़ायरफ़ॉक्स → गेको
• ओपेरा → प्रेस्टो(अब फ़रवरी 2013 से प्रेस्टो का उपयोग नहीं करता है, ओपेरा = क्रोम पर विचार करें, इसलिए आजकल ब्लिंक करें )
• सफ़ारी → वेबकिट
• क्रोम → ब्लिंक ( वेबकिट का एक कांटा )।

विभिन्न क्षेत्रों में तुलना की सूची के लिए वेब ब्राउज़र इंजन की तुलना देखें ।

अंतिम सवाल ... IE द्वारा समर्थित WebKit है?

मूल रूप से नहीं।

Comments

.. मेरे अपडेट को संबोधित करने के लिए धन्यवाद। तो अगर IE WebKit का समर्थन नहीं करता है, और मुझे पता है कि यह -moz-गुणों का समर्थन नहीं करता है ... मैं IE को CSS3 शैलियों को कैसे स्वीकार कर सकता हूं?

— हिस्टो

@ हिस्टो: आपको किस शैली की आवश्यकता है, इस पर निर्भर करता है।

— kennytm

मेरे मन में कोई ख़ास बात नहीं थी ... मुझे सिर्फ इतना पता है कि जब यह क्रॉस-ब्राउज़र कम्पैटिबिलिटी की बात आती है तो IE बेकार हो जाता है और मैं सोच रहा था कि क्या WebKit उस मुद्दे को ठीक करने का एक तरीका था।

— हिस्टो

अद्यतन किया जाना चाहिए। Chrome देव ने वेबकिट को कांटा है, और ओपेरा किसी भी लंबे समय तक presto का उपयोग नहीं कर रहा है

— रिचर्ड

EdgeHTML को अब बंद कर दिया गया है।

— ड्रीमटाइक

Answer 2

@KennyTM ने क्या कहा:

• अर्थात
  • इंजन: ट्राइडेंट
  • सीएसएस-उपसर्ग: -ms
• धार
  • इंजन: EdgeHTML → ³ पलक
  • सीएसएस-उपसर्ग: -ms
• फ़ायरफ़ॉक्स
  • इंजन: गेको
  • सीएसएस-उपसर्ग: -moz
• ओपेरा
  • इंजन: प्रेस्टो → ब्लिंक ^१
  • सीएसएस-उपसर्ग: -o(प्रेस्टो) और -webkit(ब्लिंक)
• सफारी
  • इंजन: वेबिट
  • सीएसएस-उपसर्ग: -webkit
• क्रोम
  • इंजन: वेबकिट → ब्लिंक ²
  • सीएसएस-उपसर्ग: -webkit

^१) १२ फरवरी २०१३ को ओपेरा (संस्करण १५+) ने घोषणा की कि वे अपने स्वयं के इंजन प्रेस्टो से पलक नाम के वेबकीट की ओर बढ़ रहे हैं ।

²⁾ 3 अप्रैल 2013 को Google (Chrome संस्करण 28+) ने घोषणा की कि वे WebKit- आधारित ब्लिंक इंजन का उपयोग करने जा रहे हैं ।

³⁾ 6 दिसंबर 2018 को Microsoft (Microsoft Edge 79+ स्थिर) ने घोषणा की कि वे WebKit- आधारित ब्लिंक इंजन का उपयोग करने जा रहे हैं ।

Comments

.. यह महान जानकारी है! तो क्या अलग-अलग रेंडरिंग इंजन इन उपसर्गों को अनदेखा करेंगे? यानी चाहेंगे फ़ायरफ़ॉक्स उपेक्षा -msie, -o, -webkit, चाहेंगे वेबकिट उपेक्षा -moz, -o, -msie, आदि...?

— हिस्टो

@ हिस्ट्रो हाँ, यह वैध सीएसएस के रूप में उनमें से किसी को भी नहीं पहचानता है, इसलिए यह उन्हें अनदेखा करता है

— JKirchartz

JKirchartz सही है। अन्य ब्राउज़र एक दूसरे को सीएसएस-उपसर्ग की अनदेखी करेंगे।

— जेरोन

और यह कि WebKit कि ओपेरा बढ़ रहा है क्रोमियम किस्म है, जो खुद ब्लिंक में बदल रही है।

— BoltClock

Answer 3

वेबकिट एक वेब ब्राउज़र रेंडरिंग इंजन है जिसका उपयोग सफारी और क्रोम (दूसरों के बीच, लेकिन ये लोकप्रिय हैं) द्वारा किया जाता है।

-webkitCSS चयनकर्ताओं पर उपसर्ग गुण है कि कर रहे हैं केवल इस इंजन की प्रक्रिया, बहुत के समान करने का इरादा है -mozगुण। हम में से कई उम्मीद कर रहे हैं कि यह दूर हो जाएगा, उदाहरण के -webkit-border-radiusलिए मानक द्वारा प्रतिस्थापित किया border-radiusजाएगा और आपको कई ब्राउज़रों के लिए एक ही चीज़ के लिए कई नियमों की आवश्यकता नहीं होगी । यह वास्तव में "पूर्व-विनिर्देश" सुविधाओं का परिणाम है, जिनके बारे में आने पर मानक संस्करण में हस्तक्षेप न करने का इरादा है।

आपके अपडेट के लिए: ... नहीं, यह वास्तव में IE से संबंधित नहीं है, IE कम से कम 9 से पहले एक अलग रेंडरिंग इंजन का उपयोग करता है जिसे ट्रिडेंट कहा जाता है ।

Comments

तो -webkit-सीएसएस 3 सुविधाओं के उन्नत प्रतिपादन के लिए फ़ायरफ़ॉक्स की तरह इस्तेमाल किया जा सकता है?

— हिस्टो

नहीं, फ़ायरफ़ॉक्स एक रेकिंग इंजन का उपयोग करता है जिसे गेको

— गैरेथ

@Hristo - फ़ायरफ़ॉक्स कुछ समान गुणों का उपयोग करता है, लेकिन वे कहा जाता है -moz(मोज़िला के लिए), यह ध्यान नहीं देंगे -webkitजब शैलियों को पार्स भूमिकाओं :)

— निक Craver

Answer 4

यह उत्तर दिया गया है और स्वीकार किया गया है, लेकिन अगर कोई अभी भी सोच रहा है कि आज चीजें थोड़ी गड़बड़ क्यों हैं, तो आपको यह पढ़ना होगा:

http://webaim.org/blog/user-agent-string-history/

यह एक अच्छा विचार देता है कि जेको, वेबकिट और अन्य प्रमुख रेंडरिंग इंजन कैसे विकसित हुए और किसने उपयोगकर्ता-एजेंट स्ट्रिंग्स को गड़बड़ाने की वर्तमान स्थिति को जन्म दिया।

टीएल के लिए अंतिम पैराग्राफ उद्धृत करना; डीआर उद्देश्य:

और फिर Google ने क्रोम का निर्माण किया, और क्रोम ने वेबकिट का उपयोग किया, और यह सफारी की तरह था, और सफारी के लिए बनाए गए पेज चाहते थे, और इसलिए सफारी का दिखावा किया गया। और इस प्रकार क्रोम ने WebKit का उपयोग किया, और सफारी होने का नाटक किया, और WebKit ने KHTML होने का नाटक किया, और KHTML ने गेको का नाटक किया, और सभी ब्राउज़रों ने मोज़िला होने का नाटक किया, और Chrome ने स्वयं को बुलाया Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13, और उपयोगकर्ता एजेंट स्ट्रिंग एक पूर्ण गड़बड़ थी, और बेकार के पास, और हर कोई हर किसी के होने का दिखावा करता है, और भ्रम दूर हो जाता है।

Comments

ऊपर दिए गए लिंक पर जाएं, इसकी सूचनात्मक और अंतिम चरमोत्कर्ष प्रफुल्लित करने वाला है।

— अरुण प्रसाद ES

Answer 5

-webkit-बस एक समूह है जो क्रोम, सफारी, ओपेरा और आईओएस ब्राउज़र में फिट होता है। उन सभी के पास एक सामान्य पूर्वज है, इसलिए अक्सर उनकी क्षमताओं / सीमाओं (जब सीएसएस और जावास्क्रिप्ट को चलाने की बात आती है) समूह तक ही सीमित हैं।

एक डेवलपर -webkit-कुछ कोड के बाद जगह लेगा , जिसका अर्थ है कि कोड केवल क्रोम, सफारी, ओपेरा और आईओएस ब्राउज़र पर चलेगा। यहाँ एक पूरी सूची है:

-webkit- (क्रोम, सफारी, ओपेरा के नए संस्करण, लगभग सभी iOS ब्राउज़र (iOS के लिए फ़ायरफ़ॉक्स सहित); मूल रूप से, किसी भी WebKit आधारित ब्राउज़र)

-moz- (Firefox)

-o- (पुराने, पूर्व- WebKit, ओपेरा के संस्करण)

-ms- (इंटरनेट एक्सप्लोरर और माइक्रोसॉफ्ट एज)

Answer 6

अंतिम सवाल ... क्या IE द्वारा WebKit का समर्थन किया गया है?

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

अपडेट करें

Chrome फ़्रेम अब अनुरक्षित या समर्थित नहीं है ...

Comments

Chrome फ़्रेम अब समर्थित नहीं है।

— एरिक विलिजर्स

हाँ। यह सबसे अच्छा एक स्टॉप-गैप समाधान था। 8 साल, यह समय है कि IE उचित अनुरूप ब्राउज़रों को रास्ता देता है।

— एडगरनर

Microsoft चाहता है कि IE दूर चला जाए। यह पिछड़े संगतता के उद्देश्य के लिए विंडोज 10 के साथ प्रदान किया गया है।

— आरजे डुनिल

Answer 7

WebKit एक लेआउट इंजन है जिसे वेब ब्राउज़र को वेब पेजों को रेंडर करने की अनुमति देने के लिए डिज़ाइन किया गया है। WebKit इंजन विंडोज़ में वेब सामग्री प्रदर्शित करने के लिए कक्षाओं का एक सेट प्रदान करता है, और ब्राउज़र की विशेषताओं को लागू करता है जैसे कि उपयोगकर्ता द्वारा क्लिक किए जाने पर, निम्नलिखित लिंक वाली सूची को प्रबंधित करना, और हाल ही में आए पृष्ठों के इतिहास का प्रबंधन करना।

WebKit को मूल रूप से KHTML के कांटे के रूप में Apple के Safari के लिए लेआउट इंजन के रूप में बनाया गया था; यह कई अन्य कंप्यूटिंग प्लेटफार्मों के लिए पोर्टेबल है। इसका उपयोग Google के Chrome Browser में भी किया जाता है।

WebKit के WebCore और JavaScriptCore घटक GNU लेसर जनरल पब्लिक लाइसेंस के तहत उपलब्ध हैं, और WebKit के बाकी हिस्से BSD- शैली लाइसेंस के तहत उपलब्ध हैं।

स्रोत विकिपीडिया

लेआउट इंजन के बारे में अधिक जानकारी के लिए आप यहाँ देख सकते हैं

Answer 8

वेबकिट एक HTML रेंडरिंग इंजन है जिसका उपयोग क्रोम और सफारी द्वारा किया जाता है।

यह कई कस्टम सीएसएस संपत्तियों का समर्थन करता है जो पहले से उपसर्ग कर रहे हैं -webkit-।

Answer 9

वेबकिट लोकप्रिय ब्राउज़र सफारी और क्रोम, साथ ही अन्य में उपयोग किया जाने वाला रेंडरिंग इंजन है।

Answer 10

वेबकिट ऐप्पल के सफ़ारी ब्राउज़र और Google के क्रोम में उपयोग किया जाने वाला html / css रेंडरिंग इंजन है। css वैल्यूएँ प्रीफ़िक्स के साथ -webkit- वेबकिट-विशिष्ट हैं, वे आमतौर पर CSS3 या अन्य गैर-मानकीकृत विशेषताएं हैं।

2 w3c अपडेट का जवाब देने के लिए शरीर है जो इन चीजों को मानकीकृत करने की कोशिश करता है, वे नियम लिखते हैं, फिर प्रोग्रामर उन नियमों की व्याख्या करने के लिए अपने रेंडरिंग इंजन को लिखते हैं। इसलिए मूल रूप से w3c का कहना है कि DIV को इंजन-राइटर को "इस तरह" काम करना चाहिए, फिर उस नियम का उपयोग अपने कोड को लिखने के लिए किया जाता है, किसी भी बग या नियमों की गलत व्याख्या संगतता मुद्दों का कारण बनती है।

Answer 11

एक सामान्य समस्या जो मैंने एक वेबसाइट डिजाइनर के रूप में चलाई है, वह यह है कि बहुत से लोग IE6 + का उपयोग करते हैं। आमतौर पर कोई बड़ी बात नहीं है, सिवाय सीएसएस में मुझे प्रत्येक अनुरोध को प्रति ब्राउज़र पार्स करने के लिए कई रेंडरिंग सिंटैक्स जोड़ना होगा। यह बहुत अच्छा होगा यदि सीएसएस के लिए एक सार्वभौमिक रेंडरिंग सेटअप था जिसे IE क्रोम / एफएफ / ओपेरा और वेबकिट के रूप में आसानी से पढ़ सकता है। IE के साथ समस्या यह है कि अगर मैं अपनी वेबसाइट को देखने और IE के अलावा हर ब्राउज़र का उपयोग करके काम करने की तुलना में सभी उचित सीएसएस शैलियों और प्रतिपादन का उपयोग नहीं करता हूं। यह एक दुखी, मरने वाले IE ग्राहक के लिए बना सकता है।

उदाहरण यह है: मान लें कि मुझे 10% सीमा-त्रिज्या के साथ 1px, ग्रे बॉर्डर चाहिए। क्रोम और अन्य के लिए, मैं वेबकिट संपत्ति का उपयोग करता हूं। अब, IE के लिए, मुझे "सीमा: 1px ठोस # E5E5E5" और "सीमा-त्रिज्या: 10%" के सरल पुराने सीएसएस मूल्यों का उपयोग करके अलग सीएसएस शैलियों को जोड़ना होगा। एक सकारात्मक परिणाम हमेशा सभी IE ब्राउज़र संस्करणों पर गारंटी नहीं है, लेकिन अधिकांश भाग के लिए यह विधि मेरे और कई अन्य लोगों के लिए ठीक काम करती है।

Answer 12

हालांकि यह एक पुरानी पोस्ट है, इंटरनेट एक्सप्लोरर के पुराने संस्करणों के लिए रेंडर करने की एक और विधि भी है। -एसएसबी विक्रेता प्रीफ़िक्स होने के दौरान, आप कुछ जेएस एप्लिकेशन भी डाउनलोड कर सकते हैं और उन्हें HTML के हेड के नीचे रख सकते हैं।

Modernizr, HTML5 Shiv और Respond.js का उपयोग करने का प्रयास करें। ये अद्भुत IE संगत पॉलीफ़िल स्क्रिप्ट हैं जो पॉलीफ़िल और अन्य संसाधनों का उपयोग करते हैं जो IE9 और नीचे में HTML5 तत्वों को बेहतर ढंग से प्रस्तुत करने में मदद करेंगे।

इन पॉलीफ़िल्स का उपयोग करने के लिए, उन्हें रखने के लिए बस HTML बूलियन तर्क जोड़ें, यदि ब्राउज़र इच्छा IE संस्करण से कम है। उदाहरण कोड है:

<head>
<!-- HEAD Elements -->  
<script src="path/to/modernizr.js" type="text/javascript"></script>
<!--[if lt IE 6]>
  <script src="path/to/HTMLSiv.js" type="text/javascript">
  </script>
  <script src="path/to/respond.js" type="text/javascript">
  </script>
<![endif]-->
</head>

Answer 13

WebEnginesविशेष रूप से webKitऔर इसके डेवलपर्स के बारे में एक अच्छा प्रलेखन जो आप यहां पढ़ सकते हैं: WebKit

Answer 14

वेबकिट लोकप्रिय ब्राउजर सफारी और क्रोम में उपयोग किया जाने वाला रेंडरिंग इंजन है, साथ ही अन्य प्रत्येक ब्राउजर HTML / CSS वेब पेज को खींचने के लिए एक रेंडरिंग इंजन द्वारा समर्थित है।

IE → ट्राइडेंट (बंद) एज → एज HTML (ट्राइडेंट का क्लीन-अप कांटा) फ़ायरफ़ॉक्स → गेको ओपेरा → प्रेस्टो (अब फ़रवरी 2013 के बाद से प्रेस्टो का उपयोग नहीं करता है, आजकल ओपेरा = क्रोम पर विचार करें) सफारी → वेबकेयर क्रोम → ब्लिंक (वेबकिट का एक कांटा) ।