2008-09-16 11 views
16

मुझे आश्चर्य है कि सीएसएस को विशेष रूप से केवल सीएसएस का उपयोग करके सफारी के लिए लिखने का कोई तरीका है या नहीं। मुझे पता है कि वहां कुछ होना है, लेकिन मुझे अभी तक यह नहीं मिला है।क्या सफारी-विशिष्ट शुद्ध सीएसएस हैक बाहर हैं?

उत्तर

24

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

FYI करें, इस हैक केवल सफ़ारी 3 को लक्षित करता है, और यह भी लक्षित करता ओपेरा 9.

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari 3.0 and Opera 9 rules here */ 
} 
+1

यह ओपेरा कैसे लक्षित कर सकता है? यह सफारी और क्रोम को लक्षित करता है, जो दोनों वेबकिट इंजन का उपयोग करते हैं। –

+1

यहां हैक का मूल स्रोत: http://themechanism.com/blog/2008/01/08/safari-css-hack-redux/। अनुपूरक: यह ओपेरा 9 का समर्थन करता है, लेकिन ओपेरा 9.5 नहीं। यह हैक मूल रूप से 2007 में कल्पना की गई थी, इसलिए यह शायद 2011 में काफी पुराना हो गया है। –

2

तो प्रतीक्षा करें, आप केवल सीएसएस का उपयोग करके सफारी के लिए सीएसएस लिखना चाहते हैं? मुझे लगता है कि आपने अपने सवाल का खुद ही जवाब दे दिया है। वेबकिट वास्तव में अच्छा सीएसएस समर्थन है। यदि आप वेबकिट केवल शैलियों की तलाश में हैं, तो here आज़माएं।

0

सीएसएस को विशेष रूप से सफारी/वेबकिट में भेजने के लिए आपको उपयोगकर्ता-एजेंट स्नीफिंग करने के लिए जावास्क्रिप्ट या अपने सर्वर का उपयोग करना होगा।

5

कुछ हैक्स आप सीएसएस में केवल सफारी को लक्षित करने के लिए उपयोग कर सकते हैं, जैसे अर्द्ध-कोलन के बाद हैश/पाउंड (#) डालना, जिससे सफारी इसे अनदेखा कर सकती है। उदाहरण के लिए

.blah { color: #fff; } 
.blah { color: #000;# } 

सफारी में रंग सफेद हो जाएगा, बाकी सब कुछ में यह काला होगा।

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

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

सफारी वेबकिट का उपयोग करता है, जो सीएसएस को प्रस्तुत करने के साथ बहुत अच्छा है। मैंने सफारी में काम नहीं करने वाली किसी भी चीज में कभी नहीं देखा है, लेकिन अन्य आधुनिक ब्राउज़रों में (आईई की गिनती नहीं करता है, जिसमें यह सब एक साथ है)। मैं यह सुनिश्चित करने का सुझाव दूंगा कि आपका सीएसएस standards compliant है, क्योंकि समस्या सीएसएस में हो सकती है, न कि सफारी में।

+1

यह काम नहीं करता है। –

+4

ऐसा शायद इसलिए है क्योंकि वेबकिट को इसका सामना करने के लिए तय किया गया था। यह जवाब 2008 से था, जब उपरोक्त हैक सफारी में काम करता था। तथ्य यह है कि यह अब काम नहीं करता है, मैं उस बिंदु को हाइलाइट करता हूं जो मैं पहले स्थान पर हैक्स का उपयोग नहीं कर रहा था, क्योंकि वे हमेशा भविष्य में काम करने की गारंटी नहीं देते हैं। –

+0

अच्छा बिंदु। :-) –

-1

यह वास्तव में आप क्या करने की कोशिश कर रहे हैं पर निर्भर करता है। क्या आप कुछ CSS3 विशेषताओं का उपयोग करके सफारी में बस कुछ विशेष करने की कोशिश कर रहे हैं या आप साइट क्रॉस ब्राउज़र को अनुपालन करने की कोशिश कर रहे हैं?

यदि आप एक साइट क्रॉस ब्राउज़र अनुपालन करने की कोशिश कर रहे हैं तो मैं सही सीएसएस का उपयोग करके सफारी/फ़ायरफ़ॉक्स/ओपेरा में अच्छा दिखने के लिए साइट लिखने की सिफारिश करता हूं और फिर आईई में सशर्त सीएसएस का उपयोग करके आईई के लिए परिवर्तन करना चाहता हूं। यह (उम्मीद है) आपको ब्राउज़र के भविष्य के लिए अनुकूलता प्रदान करेगा, जो सीएसएस नियमों का पालन करने में बेहतर हो रहा है, और क्रॉस ब्राउज़र संगतता प्रदान करता है। This is an example.

सशर्त स्टाइलशीट का उपयोग करके आप सभी एक साथ हैक से बच सकते हैं और ब्राउज़र को लक्षित कर सकते हैं।

यदि आप सफारी में कुछ विशेष करना चाहते हैं तो this देखें।

0

@media स्क्रीन और (-webkit मिनट-डिवाइस पिक्सेल-अनुपात: 0) {}

यह वेबकिट (क्रोम सहित) को लक्षित करने लगता है ... या इस सही मायने में Safari- है केवल?

+0

अब भी क्रोम को लक्षित करता है - 2016 –