२ free नि: शुल्क HTML र CSS कार्डहरू ब्लगहरू, इ-कमर्स र अधिकको लागि

होभर कार्डहरू

अनलाइन संसाधनहरू लगभग असीम छन्, तर उनीहरूको गुणस्तर पत्ता लगाउनु साँच्चै गाह्रो कुरा होजे होस् एक बिट खोज र डिजाइन को लागी समर्पित वेबसाइट को एक राम्रो सूची, चीजहरु सजिलो हुन्छ। एक समयमा जब HTML र CSS जस्ता भाषाहरू उत्कृष्ट समयमा हुन्छन्, नि: शुल्कको नजिक पुग्दा, उच्च-गुणस्तरको स्रोतहरू लगभग केही क्लिकहरू टाढा हुन्छन्।

हामी एक श्रृंखला को सूची गर्न जाँदैछन् HTML र CSS मा नि: शुल्क कार्डहरू जुन पूर्ण रूपमा ब्लग, व्यापार, ई-वाणिज्य र अधिकको सबै प्रकारका लागि उपयुक्त छ। एक लामो-दायरा स so्ग्रह ताकि यो ग्राहकको सबै प्रकारका लागि तपाईंले गरिरहनु भएको केहि कार्यमा समाहित हुन सक्छ। यो सूचीको साथ यसलाई गरौं जुन codepen.io प्रयोग गर्दछ ताकि तपाईं दुबै HTML र CSS मा कोड प्राप्त गर्न सक्नुहुनेछ।

अनुक्रमणिका

ब्लग कार्ड फन # १

कार्ड फन

una उत्कृष्ट डिजाइन कार्ड छविले प्रतिनिधित्व गर्दछ कि लगभग सबै भन्छन्, तपाईं कोडन.यो को माध्यम बाट जान सक्नुहुन्छ सम्बन्धित कोड प्राप्त गर्न र यसलाई आफ्नो वेबसाइटमा स्थापना गर्न।

CSS समाचार कार्डहरू केवल CSS

समाचार कार्ड

यस कार्डको साथ पृष्ठभूमिको रूपमा अपरिचित चीजहरू, यसको सहज एनिमेसनको लागि बाहिर खडा छ कि सामग्री प्रकट गर्दछ। यो शुद्ध CSS हो।

ब्लग पोष्ट आईटम

ब्लग पोष्ट यस माथि माउस सूचक ल्याएर वेबको पूर्वावलोकन। यसमा CSS र HTML छ सजिलो निगमनका लागि।

ब्लग कार्डहरू

ब्लग कार्डहरू

एक न्यूनतम उत्तरदायी ब्लग कार्ड डिजाइन। छिटो र चिकना एनिमेसनहरू कसैलाई उदासीन न छोड्ने उच्च गुणस्तर।

उत्तरदायी व्यापार कार्डहरू

उत्तरदायी कार्डहरू

को लागी खडा छ हल्का एनिमेसन कार्ड छवि माथि माउस पोइन्टर होभर गरेर।

अर्को ब्लग कार्ड

ब्लग होभर कार्ड

देखिन्छ होभर हुँदा कार्ड पाठ उहीमा।

व्यापार कार्डहरू

कार्ड भ्रमण गर्नुहोस्

una सरल तर हालको कार्ड डेमो र कोड HTML र CSS मा भ्रमण गर्नुहोस्।

थ्रीडी व्यापार कार्ड

थ्रीडी फ्लिप कार्ड

यो कार्ड लायक छ HTML र CSS को साथ एक थ्रीडी एनिमेसन। एलेना नासारोभाद्वारा बनाइएको, यो रंग-हडताल गर्ने व्यापार कार्डको लागि उत्तम छ।

CSS व्यवसाय कार्ड

CSS व्यवसाय कार्ड

CSS मा धेरै हडताल गर्ने व्यवसाय कार्ड जुन थ्रीडीमा घुमाउँदछ URL ठेगानाहरूको श्रृ series्खलाको लागि मार्ग बनाउँन जुन हामीले माउन्ट सूचकमा प्रतिक्रिया दिन्छौं।

कार्ड ग्रिडहरू

ग्रिड कार्ड

संग राम्रो राखिएको कार्डको श्रृंखला एक आँखा आकर्षित गर्ने डिजाइन। यो यसको सरल सौंदर्यशास्त्रको लागि आश्चर्यजनक छ, तर HTML, CSS र SCSS कोडमा राम्रो हिटको साथ।

थ्रीडी कार्डहरू प्रकट भइरहेको छ

थ्रीडी कार्ड

कार्ड ग्रिडको यो श्रृंखला यस समयमा अधिक जानकारी प्रकट गर्नुहोस् कि हामीले माउसलाई हरियोमा आइकनमा छोडेका छौं। उही समयमा जुन हामीले सूचक छोड्छौं, बाँकी ग्रिड त्यस्तै हिसाबले लिन्छ।

उत्तरदायी सामग्री डिजाइन कार्ड

भौतिक डिजाइन

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

फ्लेक्सबक्स कार्ड ग्रिड

फ्लेक्सबक्स

कार्ड प्रोटोटाइप उहि उचाईमा तिनीहरू ग्रिड फ्लेक्सबक्स ढाँचा प्रयोग गर्नका लागि बाहिर खडा हुन्छन्। यसको मानहरूको अर्को सीएसएस अनुपात अनुपात र सीएसएस फिल्टरहरूको प्रयोग हो।

Clans कार्ड को संघर्ष

Clans को मतभेद

El लोकप्रिय मोबाइल खेल यसका कार्डहरू एचटिएमएल र सीएसएसमा आन्द्रे मादरंगद्वारा सिर्जना गरिएको हो। हामी तिनीहरू बीच सटीक र अत्यधिक भिजुअल एनिमेसनको साथ पास गर्न सक्छौं।

ईकामर्सका लागि स्लाइड कार्डहरू

उत्पादन कार्ड

एक संग फुर्तिलो एनिमेसनयी कार्डहरूले उनीहरूको तत्वहरू खोज्नको लागि उनीहरूलाई के गर्न लाग्छ भनेर प्रोत्साहन दिन्छ। उमर Dsoky बाट महान डिजाइन संग।

इन्टरफेस डिजाइन - उत्पाद कार्ड

उत्पाद यूआई

ती डिजाइन गर्न एक उत्तम कार्ड हाम्रो eCommerce को उत्पादन। HTML र CSS मा बनेको।

उत्पादन कार्ड

ईकामर्स उत्पाद

उही कार्डबाट हामी गर्न सक्दछौं धेरै छविहरु को माध्यम बाट जानुहोस् राम्रो उत्पादन हेर्न। यसले कार्ट बटनमा एड थप्छ र HTML, CSS र जाभास्क्रिप्ट कोड समावेश गर्दछ।

लचिलो उत्पादन कार्डहरू

फ्लेसी कार्ड

जसरी यसको नामले स indicates्केत गर्दछ, फ्लेक्सबक्स प्रयोग गर्दछ एक रोचक एनिमेसन सिर्जना गर्न जब हामी कार्ट बटनमा क्लिक गर्नुहोस्।

फ्लिप कार्डहरू

फ्लिप कार्ड

चिकनी र के साथ केही कार्डहरूको लागि सानो कोड उत्तम एनिमेसन। मिनेट को एक मामला मा तपाईं तिनीहरूलाई शामिल गर्न सक्नुहुन्छ। भर्खर कोडेप्नमा थपियो।

3D उत्पादन कार्डको रूपमा कार्डहरू

थ्रीडी कार्ड

यो नोट गर्नु पर्छ कि यी कार्डहरू हुन् मानौं यदि हामीसँग टेबुलमा कार्डको श्रृंखला छ। सूचक छोडियो र तिनीहरू जुम इन गर्नुहोस्, प्रत्येकमा क्लिक गर्नुहोस्, र कार्डको पछाडि देखाउनुहोस् उत्पादन जानकारी देखाउनका लागि। हामी फेरि क्लिक गर्छौं र यसलाई अगाडि भएको जस्तो छोड्छौं। 3D CSS गुणहरू सिक्नका लागि उत्तम।

लंबन कार्ड

लंबन कार्ड

एक संग धेरै दृश्य प्रयोग फ्लिप प्रभाव आँखा-लाई पकड्ने। यो उत्तम छ कि तपाईले यो हेर्दै हुनुहुन्छ कि यो को कुरा गरिरहेको छ भनेर जान्न।

कार्डका लागि प्रभाव होभर

होभर कार्ड

एक सरल प्रभाव तर नक्कली होभर कार्डको बारेमा।

साधारण होभर प्रभाव

साधारण कार्ड

स्ट्राइकि rather बरु साधारण प्रभाव, तर यसले हामीले यस दृश्यको क्षणमा ठूलो प्रभाव पार्छ।

लम्बाई गहिराइ कार्ड

लम्बाई गहिराइ

यी कार्डहरू सहन शीर्षमा लंबन अवधारणा डिजाइन द्वारा केहि धेरै हडताल कार्डहरू गठन गर्न। हाम्रो बसमा केही कोटीहरू चयन गर्दा यो प्रयोगकर्तामा यसले पार्ने असरलाई राम्रोसँग बुझ्नको लागि तपाईंले यसलाई हेर्नुपर्दछ।

चलचित्रहरूको लागि UI कार्ड

चलचित्र कार्ड

को एक कार्ड HTML सँग बनेको उत्तम लेआउट र CSS।

प्रोफाइल कार्ड

सम्पर्क कार्ड

म्यु राम्रो एनिमेसन एक सम्पर्क कार्डको लागि जहाँ हामी सामाजिक मिडिया प्रोफाइलहरूमा पहुँच कार्यान्वयन गर्न सक्दछौं। HTML र CSS।

पोलोरोइड बन्डल कार्डहरू

Polaroid

गुणहरू, फिल्टरहरू र साथ CSS अनुकूलन ट्रान्जिसनहरू यो श्रृंखला Polaroid समूह कार्ड बनाईएको छ; यी SVG छवि वेब याद नगर्नुहोस्.


लेखको सामग्री हाम्रो सिद्धान्तहरूको पालना गर्दछ सम्पादकीय नैतिकता। त्रुटि क्लिक गर्न रिपोर्ट गर्नुहोस् यहाँ.

एक टिप्पणी, तपाइँको छोड्नुहोस्

तपाइँको टिप्पणी छोड्नुहोस्

तपाईंको ईमेल ठेगाना प्रकाशित हुनेछैन। आवश्यक फिल्डहरू चिन्ह लगाइएको छ *

*

*

  1. डाटाका लागि उत्तरदायी: मिगुएल gelन्गल ग्याटन
  2. डाटाको उद्देश्य: नियन्त्रण स्पाम, टिप्पणी प्रबन्धन।
  3. वैधानिकता: तपाईंको सहमति
  4. डाटाको सञ्चार: डाटा कानुनी बाध्यता बाहेक तेस्रो पक्षलाई सूचित गरिने छैन।
  5. डाटा भण्डारण: डाटाबेस ओसीन्टस नेटवर्क (EU) द्वारा होस्ट गरिएको
  6. अधिकार: कुनै पनि समयमा तपाईं सीमित गर्न सक्नुहुनेछ, पुन: प्राप्ति र तपाईंको जानकारी मेटाउन।

  1.   क्रिस्टियन भन्यो

    WordPress मा पृष्ठमा यी कुनै पनि कार्ड घुसाउन सम्भव छ