शीर्षलेख आणि तळटीप आहेत नवीन पृष्ठ तयार करताना आवश्यक घटक वेब किंवा ब्लॉग किंवा अन्य काही नसल्यास आम्हाला वेब डिझाइनच्या सद्य मानकांची पूर्तता करण्यासाठी त्यांना अद्यतनित करण्याची आवश्यकता आहे. ते रिक्त स्थान आहेत ज्यात आमच्या वेबसाइटवर अभ्यागत सहसा खूप लक्ष देतात, म्हणून आम्हाला त्यांची काळजी घ्यावी लागेल आणि त्यांचे पुरेसे लाड करावे लागेल जेणेकरून ते कार्य करण्याऐवजी डोळ्याला आनंद देतील.
म्हणूनच आम्ही सामायिक करणार आहोत 29 आपण आपल्या ब्लॉग किंवा वेबसाइटवर वापरू शकता अशा CSS शीर्षलेख आणि तळटीप, आणि अशा प्रकारे आपण शोधत असलेल्या गुणवत्तेचा तो बिंदू द्या. आपल्या वेबसाइटवर दृष्टीकोन दर्शविण्यासाठी ही सूची पूर्ण स्क्रीन लेख शीर्षलेख तसेच मानक आकार, निश्चित किंवा निश्चित शीर्षलेख, फूटर आणि काही व्हिडिओ शीर्षलेखांची बनलेली आहे.
वक्र शीर्षलेख
हेडर ज्याद्वारे ओळखले जाते तळाशी त्याची वक्र शैली जे वेबसाइट किंवा ब्लॉगसाठी हे एक विशेष शीर्षक बनवते. हे शुद्ध सीएसएस आहे, म्हणूनच आपण आपल्या ब्लॉगमध्ये हे समाविष्ट केल्यास ते कसे दिसेल हे आपल्या वेब स्टेजिंगमध्ये चाचणी घेण्यास आधीच वेळ घेत आहे.
शीर्षलेख प्रतिमा लंबन
उत्कृष्ट पॅरालॅक्स प्रतिमेसह, हेडर स्वतःस त्याद्वारे ओळखते सीएसएस पार्श्वभूमी-प्रतिमा स्थिती वापरा. उत्कृष्ट प्रभाव कोडसाठी शीर्षलेख प्रतिमा पृष्ठाच्या शीर्षस्थानी स्थित केली जाईल.
शीर्षलेख निश्चित कोनात
हे हेडर वेब पृष्ठाच्या शीर्षस्थानी ते निश्चित केले आहे त्या कर्णरेषा भिन्न करा जे वापरकर्त्याच्या दृश्याचे संपूर्ण आडवे ओलांडते. हे पार्श्वभूमी प्रतिमेसह निश्चित शीर्षलेख तयार करण्यासाठी सीएसएस स्यूडो-घटक कसे वापरले जाऊ शकतात हे दर्शविते.
स्किव्ह्ड हेडर
या शीर्षकासाठी सीएसएस आणि एचटीएमएल जे दिलेल्या उदाहरणात वैशिष्ट्यीकृत आहेत त्या कर्णरेषेच्या बाजूने जे संपूर्ण स्क्रीन एका बाजूला पासून दुसर्‍या बाजूला ओलांडते.
एसव्हीजी अ‍ॅनिमेशनसह शीर्षलेख
एक अगदी सोपा शीर्षलेख, जरी तो वापरतो स्वत: ला वेगळे करण्यासाठी एसव्हीजी अ‍ॅनिमेशन आमच्याकडे या यादीमध्ये आहे. आपण वेब पृष्ठांच्या मोठ्या सूचीमध्ये प्रवेश करू शकता येथून एसव्हीजी अ‍ॅनिमेशनसह.
Div सह निश्चित शीर्षलेख
लंबित प्रतिमेच्या परिणामासह, एक निश्चित शीर्षलेख जो महान परिणामासाठी दर्शविला जातो आम्ही माउससह स्क्रोल करत असताना उर्वरित स्क्रोल करीत असताना निश्चित पार्श्वभूमी प्रतिमेसह प्राप्त केले.
पॅरालॅक्स मल्टी-लेयर स्पष्टीकरण
मध्ये उत्कृष्ट समाप्त करणारा एक शीर्षलेख एकाधिक-स्तरित एचटीएमएल, सीएसएस आणि जावास्क्रिप्ट आणि व्हिडिओ गेमच्या जगाशी संबंधित वेबसाइटसाठी याचा उत्तम वापर केला जाऊ शकतो. संपूर्ण छान.
निश्चित पोस्ट शीर्षलेख
एचटीएमएल, सीएसएस आणि जावास्क्रिप्टमध्ये केलेल्या प्रत्येक पोस्टसाठी निश्चित शीर्षलेख. ज्या क्षणी आम्ही खाली उतरलो आहोत, शीर्षलेख कमी केला आहे आणि शीर्षस्थानी निश्चित केले.
अ‍ॅनिमेशनसह पूर्ण स्क्रीन शीर्षलेख
एक अ‍ॅनिमेशन प्रदान करणारे हेडर उशीरा हलवते आणि त्या प्रेक्षकांवर विश्रांतीचा प्रभाव आणते.
पूर्ण स्क्रीन हिरो प्रतिमा
सह झूम प्रभाव, हे शीर्षलेख पूर्ण स्क्रीन हे महान मौलिकतेपैकी एक म्हणून प्रकट झाले आहे. एखाद्या वेबसाइटसाठी परिपूर्ण ज्यामध्ये अभ्यागत आपल्या भोवती फिरण्यासाठी स्क्रोलिंगचा चांगला वापर करेल.
बटणासह फ्लेक्सबॉक्स
एक बटण प्रदर्शित करण्यासाठी स्क्रीनची संपूर्ण रुंदी घेणारा एक शीर्षलेख. लँडिंग पृष्ठांसाठी योग्य सीएसएस फ्लेक्सबॉक्ससह.
फ्लेक्सबॉक्स हीरो शीर्षलेख
प्रभाव असलेले हेडर पॅरालॅक्स आणि फ्लेक्सबॉक्स अगदी सोपे हे प्रामुख्याने त्याच्या डिझाइनची अभिजातता दर्शविते.
स्क्रोल वर चिकट शीर्षलेख
जसे त्याचे नाव सूचित करते, तेव्हा एक निश्चित शीर्षलेख हलताना आपण माउससह स्क्रोल करू उर्वरित वेब पृष्ठ पहाण्यासाठी.
उत्तरदायी स्क्रोलिंग स्टिकी
मेनू पृष्ठाच्या शीर्षस्थानी पोहोचतो तेव्हा, उत्कृष्ट परिणामाचे आणखी एक निश्चित शीर्षलेख, काआणि त्या क्षणी ते स्थिर राहिले आणि आम्ही साइट स्क्रोल करत राहू शकतो.
स्क्रोल शीर्षलेख
हे बाकीच्यांपेक्षा भिन्न आहे योग्य आणि नाजूक अ‍ॅनिमेशन जसे आपण पुढे जाऊ. त्याच्या शेवटी, हेडबोर्ड शीर्षस्थानी निश्चित केलेले आहे.
प्रतिसाद स्क्रोल शीर्षलेख
यासाठी आणखी एक उत्कृष्ट अ‍ॅनिमेशन बाकीच्यापेक्षा हे हेडर वेगळे करा एचटीएमएल, सीएसएस आणि जावास्क्रिप्ट सह.
शीर्षलेख आत / बाहेर
प्रभावाद्वारे वेगळे केलेले एक शीर्षलेख स्क्रोल केल्यावर / बाहेर आणि त्या पराभवाची खळबळ उत्पन्न करते.
शीर्षलेख फिकट
दुसरा अ‍ॅनिमेशन प्रभाव उत्सुक आणि अतिशय मोहक एचटीएमएल, सीएसएस आणि जावास्क्रिप्ट मध्ये.
लपविलेले हेडर
त्यानुसार लपवित असताना एक भिन्न शीर्षलेख आम्ही अ‍ॅनिमेशनसह स्क्रोलिंग वापरतो त्याकडे कोणाचेही लक्ष नाही परंतु ते उत्तम प्रतीचे आहेत.
लंबन तळटीप
एचटीएमएल, सीएसएस आणि जावास्क्रिप्टसह एक निश्चित किंवा निश्चित फूटर. च्या शेडिंग सह उत्कृष्ट गुणवत्ता परिणाम.
सामग्री स्केलसह तळटीप
यासाठी उच्च गुणवत्ता आणि मूळ तळटीप पाहणा ast्याला चकित करा हे वेब स्थान प्रदर्शित करण्याच्या मोहक मार्गासाठी.
सोशल मीडिया तळटीप
बाहेर उभे असलेले एक तळटीप सामाजिक नेटवर्कवर निर्देशित केलेली बटणे सर्वात चांगले प्रत्येक सामाजिक नेटवर्कवर माउस पॉईंटर सोडताना तयार केलेले अ‍ॅनिमेशन उभे होते.
अ‍ॅनिमेटेड मोबाइल तळटीप मेनू
हा तळटीप पाहण्यासाठी आपली वेब ब्राउझर विंडो संकीर्ण करून, आपण हे करू शकता 2-3 विभाग शोधा वापरकर्ता मोबाइल डिव्हाइसवर शोधू शकतो. हे 767px वर प्रदर्शित आहे.
सोपी मुदत तळटीप
एचटीएमएल आणि सीएसएस मेड एक आहे जास्त धूमधाम आणि फ्रिल्सशिवाय साधा फूटर.
व्हिडिओ शीर्षलेख प्रतिक्रिया द्या
सह एक शीर्षलेख सोपा व्हिडिओ React.js.
व्हिडिओ शीर्षलेख
इतर सोपा व्हिडिओसह शीर्षलेख आणि उत्कृष्ट प्रतीचे.
मिक्स-ब्लेंडसह पूर्ण स्क्रीन व्हिडिओ शीर्षलेख
दर्शवा एक पूर्ण स्क्रीन व्हिडिओ मिक्स-ब्लेंड मोड वापरुन लेयर टेक्स्ट सह.
व्हिडिओ शीर्षलेख अ‍ॅनिमेशन
अ‍ॅनिमेशन होते प्रभाव नंतर Adobe सह सानुकूलित सर्व ब्राउझरशी सुसंगत असणे. हे मोबाईलवर चालत नाही.
ग्रेडियंटसह प्रतिसादात्मक व्हिडिओ शीर्षलेख
El ग्रेडियंट म्हणजे काय उर्वरित या व्हिडिओ शीर्षलेखात.
त्या सर्वांनी मला पटवून दिले. धन्यवाद
आपले स्वागत आहे!