वीडियो स्कैन 2025, अप्रैल

सभी को देखने के लिए धन्यवाद, इसका मतलब है मेरे और इस साइट के लिए सब कुछ। यह ब्लॉग पोस्ट इस श्रृंखला में हमारे द्वारा कवर की गई सभी चीजों के लिए संसाधनों की एक विशाल सूची है ”

जब आप इनलाइन का उपयोग करते हैं, तो सभी तत्व डोम और एस और किसी अन्य एचटीएमएल तत्व की तरह ही हैं। यदि आपके पास SVG है जैसे: और आप करते हैं: var rect = "

इस पेंचकस में हम Léonie Watson के सुलभ एसवीजी के बारे में सभी लेखों को खोदते हैं और अनिवार्य रूप से इसके द्वारा बिंदु तक जाते हैं। मुझे लगता है कि पहला बिंदु "

हमने इनलाइन और तत्व का उपयोग करने के बारे में बात करने में बहुत समय बिताया है। आप इसके साथ एक आइकन सिस्टम बना सकते हैं जो फायदे के साथ व्याप्त है। आप बना सकते हैं "

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

जावास्क्रिप्ट उन तरीकों में से अंतिम है जिन्हें हम एसवीजी को एनिमेट करने पर कवर करेंगे। हमने सीएसएस को देखा, जो बहुत अच्छा और बहुत आरामदायक है, लेकिन यह कई एसवीजी नहीं कर सकता है "

क्लिपिंग और मास्किंग की अवधारणा बहुत सरल है। तत्वों के कुछ हिस्सों को छिपाएं और दूसरों को दिखाएं। उनके बीच वास्तविक अंतर बहुत सरल है "

शायद आपने सीएसएस फिल्टर के बारे में सुना है? आप उन्हें सीएसएस से किसी भी तत्व को लागू कर सकते हैं, जैसे: .apply-css-filter (-webkit-filter: ग्रेस्केल (0.5); फ़िल्टर: "

संभवतः इसके लिए एक बहुत बड़ा उपयोग-मामला नहीं है, स्पष्ट के अलावा: आपको बड़े एसवीजी डिज़ाइन में अन्य चीजों के बीच एक रेखीय ग्राफिक की आवश्यकता है। "

एक दिन आ सकता है जहां आप एक ग्राफिक चाहते हैं जो आपके पास एसवीजी था, लेकिन आपके पास यह केवल जीआईआर, जेपीजी, या पीएनजी जैसे रेखापुंज में है। इस वीडियो में हम एक उदाहरण देखते हैं "

एक लोकप्रिय छोटी एसवीजी एनीमेशन तकनीक पथ ड्राइंग है। यदि आप इसे नहीं देख सकते हैं, तो यहां मेरे द्वारा बनाए गए ज़िलिन उदाहरणों का एक संग्रह है। अनिवार्य रूप से "

एसवीजी में एक तत्व है। यहां कोई बड़ा आश्चर्य नहीं है: यह एसवीजी में पाठ डालने के लिए है। अक्षरों के आकार की रूपरेखा नहीं (हालांकि आप ऐसा कर सकते हैं) लेकिन "

यह एक छोटी सी बात है, मुझे बस एक बार खुद ऐसा करने की जरूरत है और यह भ्रामक है इसलिए मैंने सोचा कि मैं इस पर एक पूरी वीडियो करूंगा। बात है,"

इस पर वीडियो को हटा दिया गया था। मैं किसी दिन इसे फिर से शूट करूंगा। यदि आप इसे पढ़ रहे हैं और मैंने इसे अभी तक नहीं किया है, तो बेझिझक मुझसे संपर्क करें और मुझे बग करें "

यह टिप केवल तभी लागू होती है जब आपके पास Adobe Illustrator CC (क्रिएटिव क्लाउड) होता है। मैंने पुष्टि की है कि यह उस में काम करता है, या यहां तक ​​कि नए सीसी 2014। यह जितना आसान हो सकता है "

भले ही सीएसएस के साथ एसवीजी को एनिमेट करना औसत फ्रंट-एंड व्यक्ति के लिए अधिक आरामदायक हो सकता है, एसवीजी के पास एक और तरीका है जिससे एसवीजी में सही बनाया गया एनीमेशन "

जब आप इनलाइन SVG का उपयोग करते हैं, तो वह सभी SVG कोड HTML में सही होता है, और इस प्रकार DOM में। आप उन्हें वैसे ही स्टाइल कर सकते हैं जैसे आप, या कोई अन्य HTML "

हमने सीखा है कि एसवीजी के एक बिट डालने के लिए उपयोग करने की एक सीमा यह है कि आप यौगिक सीएसएस चयनकर्ताओं को नहीं लिख सकते हैं जो वहां से प्रभावित होते हैं। उदाहरण के लिए: यह "

शब्द "बिल्ड टूल" डरावना हो सकता है। यह फैंसी कमांड लाइन टूल्स को ध्यान में लाता है, जो कॉन्फ़िगरेशन और अजीब सिस्टम निर्भरता की आवश्यकता होती है जो आपको "

इनलाइन एसवीजी को इस अर्थ में "स्टाइल" किया जा सकता है कि इसमें पहले से ही भरता है और स्ट्रोक करता है और दूसरा जिसे आप पृष्ठ पर डालते हैं। यह कमाल है और एक पूरी तरह से "

स्टॉक फ़ोटोग्राफ़ी साइटों में हमेशा "वेक्टर" द्वारा खोज परिणामों को फ़िल्टर करने का एक तरीका होता है। और याद रखें, जब आप कुछ डाउनलोड करते हैं तो आपको कोई भी प्रारूप नहीं मिलता है "

हमने सीखा है कि एसवीजी से भरे फोल्डर को एसवीजी डिफेक्ट ब्लॉक में बदलने जैसे कार्यों के लिए विशेष रूप से कमाल के उपकरण हैं। हमेशा की तरह "

हम अपने निर्माण उपकरणों के साथ निश्चित रूप से थोड़ा निर्वस्त्र हो सकते हैं। इसे पोस्ट करते समय, बिल्ड टूल्स का पोस्टर बच्चा ग्रंट है। प्रतियोगी हैं, "

एक बार जब हमारे पास एसवीजी के हमारे "डिफेक्ट ब्लॉक" कहे जाते हैं - एसवीजी का वह हिस्सा जो उन सभी चीजों को परिभाषित करता है जिन्हें हम बाद में आकर्षित करना चाहते हैं - हम इसे कहां डालते हैं? इसलिए"

तत्व इनलाइन SVG आइकन सिस्टम के इस पूरे विचार के लिए क्लच है। हमने सीखा कि ऐसा करने का एक साफ तरीका यह है कि आप वह सब कुछ रखें जो आप बाद में खींचने का इरादा रखते हैं ”

यह कहते हुए कि एसवीजी दस्तावेज़ के शीर्ष पर ब्लॉक को निश्चित रूप से काम करता है। इसके कुछ फायदे भी हैं, जैसे कि कोई HTTP अनुरोध करने की आवश्यकता नहीं है, "

एसवीजी में एक बहुत ही शांत और शक्तिशाली तत्व होता है। यह अवधारणा में बहुत सरल है। यह आईडी द्वारा संदर्भित एसवीजी कोड का एक और बिट पाता है, और इसे क्लोन करता है "

हमने "इनलाइन SVG" कवर किया है - जो SVG सिंटैक्स को सही HTML में छोड़ रहा है। आप उसी इनलाइन SVG को अन्य स्थानों पर भी उपयोग कर सकते हैं, जैसे कि या "

याद रखें कि कुछ भी वेक्टर आप एसवीजी में प्राप्त कर सकते हैं। एडोब सॉफ्टवेयर इस पर बहुत अच्छा है। एक पीडीएफ में वेक्टर सामग्री हो सकती है - बस पीडीएफ खोलें और आप "

नाउ प्रोजेक्ट एसवीजी से प्राप्त करने के लिए एक (बहुत) शानदार जगह है। आइए हम एसवीजी में शाब्दिक रूप से सब कुछ की गणना करें और वास्तव में इस तरह से आते हैं कि वे "