29 CSS כעדערז און פאָאָטערס פֿאַר דיין בלאָג אָדער וועבזייטל

די כעדערז און פאָאָטערס זענען יקערדיק עלעמענטן ווען איר שאַפֿן אַ נייַע בלאַט וועב אָדער אַ בלאָג, אָדער אויב גאָרנישט אַנדערש מיר דאַרפֿן צו דערהייַנטיקן זיי צו טרעפן די קראַנט סטאַנדאַרדס פון וועב פּלאַן. זיי זענען ספּייסאַז צו וואָס די באַזוכער פון אונדזער וועבזייטל יוזשאַוואַלי באַצאָלן גרויס ופמערקזאַמקייט, אַזוי מיר האָבן צו נעמען קעיר פון זיי און באַלעווען זיי גענוג אַזוי אַז זיי זענען וואוילגעפעלן צו די אויג, אַחוץ פון פאַנגקשאַנאַל.

דעריבער מיר וועלן צו טיילן 29 CSS כעדערז און פאָאָטערס וואָס איר קענען נוצן אויף דיין בלאָג אָדער וועבזייטלאון אַזוי געבן עס די קוואַליטעט פון וואָס איר געווען קוקן פֿאַר. די רשימה איז קאַמפּרייזד פון פול פאַרשטעלן אַרטיקל כעדערז, ווי געזונט ווי די סטאַנדאַרט גרייס, פאַרפעסטיקט אָדער פאַרפעסטיקט כעדערז, פאָאָטערס און עטלעכע ווידעא כעדערז צו געבן אן אנדער פונט פון פּערספּעקטיוו צו דיין וועבזייטל.

קערווד כעדער

א כעדער וואָס איז יידענאַפייד דורך זייַן קערווד נוסח אין די דנאָ וואָס מאכט עס אַ זייער ספּעציעל כעדער פֿאַר אַ וועבזייטל אָדער בלאָג. עס איז ריין CSS, אַזוי עס נעמט שוין צייט צו פּרובירן דיין וועב סטאַגינג ווי עס וועט זיין אויב איר טאָן דאָס אין דיין בלאָג.

כעדער בילד פּאַראַללאַקס

מיט אַ גרויס פּאַראַללאַקס בילד ווירקונג, דעם כעדער אידענטיפֿיצירט זיך דורך נוצן CSS הינטערגרונט-בילד שטעלע. די כעדער בילד וואָלט זיין פּאַזישאַנד אין די שפּיץ פון די בלאַט פֿאַר גרויס ווירקונג קאָד.

כעדער פאַרפעסטיקט ווינקלדיק

דער כעדער איז געזונט פאַרפעסטיקט אין די שפּיץ פון די וועב בלאַט צו דיפערענטשיייט מיט די דיאַגאָנאַל שורה וואָס קראָסיז די גאנצע האָריזאָנטאַל פון די מיינונג פון די באַניצער. עס ווייזט ווי CSS פּסעוודאָ-עלעמענטן קענען ווערן גענוצט צו שאַפֿן אַ פאַרפעסטיקט כעדער מיט אַ הינטערגרונט בילד.

סקעוועד כעדער

CSS און HTML פֿאַר דעם כעדער אַז אין די געגעבן ביישפּיל איז קעראַקטערייזד צוזאמען די דיאַגאָנאַל שורה אַז קראָסיז די גאנצע פאַרשטעלן פון איין זייַט צו די אנדערע.

כעדער מיט SVG אַנאַמיישאַן

א זייער פּשוט כעדער, כאָטש עס ניצט אַ SVG אַנאַמיישאַן צו ויסטיילן זיך פון די וואָס מיר האָבן אויף דער רשימה. איר קענען אַקסעס אַ גרויס רשימה פון וועב זייַטלעך מיט SVG אַנאַמיישאַנז פֿון דאָ.

פאַרפעסטיקט כעדער מיט דיוו

מיט פּאַראַללאַקס בילד ווירקונג, אַ פאַרפעסטיקט כעדער וואָס שטייט אויס פֿאַר די גרויס ווירקונג אַטשיווד מיט די פאַרפעסטיקט הינטערגרונט בילד בשעת די מנוחה סקראָולז ווען מיר מעגילע מיט די מויז.

פּאַראַללאַקס מאַלטי-שיכטע געמעל

א כעדער פון גרויס ענדיקן אין מולטי-לייערד HTML, CSS און דזשאַוואַסקריפּט און וואָס קענען זיין בישליימעס געניצט פֿאַר אַ וועבזייטל וואָס איז פארבונדן צו דער וועלט פון ווידעא שפּילערייַ. גרויס ענדיקן איבער.

פאַרפעסטיקט פּאָסטן כעדער

א פאַרפעסטיקט כעדער פֿאַר יעדער פּאָסטן געמאכט אין HTML, CSS און דזשאַוואַסקריפּט. דער מאָמענט מיר זעמל אַראָפּ, די כעדער איז מינאַמייזד און פאַרפעסטיקט אין דער שפּיץ.

גאַנץ פאַרשטעלן כעדער מיט אַנאַמיישאַן

א כעדער וואָס אָפפערס אַ אַנאַמיישאַן אַז באוועגט לאַטעראַל און וואָס טראגט אַ רילאַקסינג ווירקונג אויף די צוקוקער.

גאַנץ פאַרשטעלן העלד בילד

מיט אַ פארגרעסער ווירקונג, this כעדער פול פאַרשטעלן עס איז גילוי ווי איינער פון גרויס ערידזשאַנאַליטי. שליימעסדיק פֿאַר אַ וועבזייטל אין וואָס דער גאַסט וועט נוצן די סקראָללינג און מאַך אַרום אים.

פלעקסבאָקס מיט קנעפּל 

א כעדער וואָס נעמט די גאנצע ברייט פון די פאַרשטעלן צו אַרויסווייַזן אַ קנעפּל. שליימעסדיק פֿאַר לאַנדינג בלעטער מיט CSS פלעקסבאָקס.

פלעקסבאָקס העלד כעדער

א כעדער מיט ווירקונג פּאַראַללאַקס און פלעקסבאָקס גאַנץ פּשוט וואָס דער הויפּט שטייען פֿאַר די עלאַגאַנס פון זייַן פּלאַן.

קלעפּיק כעדער אויף מעגילע

ווי זיין נאָמען סאַגדזשעס, אַ פאַרפעסטיקט כעדער ווען מיר מעגילע מיט די מויז ווען מאָווינג צו זען די רעשט פון די וועב בלאַט.

אָפּרופיק סקראָללינג קלעפּיק

אן אנדער פאַרפעסטיקט כעדער מיט גרויס ווירקונג ווען די מעניו ריטשאַז די שפּיץ פון די בלאַט, וואָסאון אין דעם מאָמענט עס בלייבט פאַרפעסטיקט און מיר קענען האַלטן סקראָללינג אויף דעם פּלאַץ.

מעגילע כעדער

עס איז אַנדערש פון די מנוחה געהעריק און יידל אַנאַמיישאַן ווי מיר מאַך. אין די סוף, די כעדבאָרד בלייבט פאַרפעסטיקט אין דער שפּיץ.

אָפּרופיק מעגילע כעדער

אן אנדער גרויס אַנאַמיישאַן פֿאַר ויסטיילן דעם כעדער פון די מנוחה מיט HTML, CSS און JavaScript.

כעדער אין / אויס

א כעדער וואָס איז אונטערשיידן דורך די ווירקונג אין / אויס נאָך סקראָללינג און וואָס טראגט די געפיל פון אָפּבאַלעמענ זיך.

כעדער וועלקן

אן אנדער אַנאַמיישאַן ווירקונג טשיקאַווע און זייער עלעגאַנט אין HTML, CSS און JavaScript.

כעדער וואָס איז פאַרבאָרגן

א אַנדערש כעדער ווען כיידינג לויט מיר נוצן סקראָללינג מיט אַן אַנאַמיישאַן אַז גייט אַננאָוטיסט אָבער פון גרויס קוואַליטעט.

פּאַראַללאַקס פוטער

א פאַרפעסטיקט אָדער פאַרפעסטיקט פוטער מיט HTML, CSS און דזשאַוואַסקריפּט. פון גרויס קוואַליטעט מיט שיידינג אין ווירקונג.

פוטער מיט אינהאַלט וואָג

א הויך קוואַליטעט און אָריגינעל פוטער פֿאַר דערשטוינען די גאַסט פֿאַר די גראַציעז וועג צו אַרויסווייַזן דעם וועב פּלאַץ.

פוס פון סאציאל מעדיע

א פוטער וואָס שטייט אויס פֿאַר די קנעפּלעך וואָס ווייַזן צו געזעלשאַפטלעך נעטוואָרקס בעסטער באַוווסט. די אַנאַמיישאַן געשאפן ווען געלאזן די מויז טייַטל איבער יעדער פון די געזעלשאַפטלעך נעטוואָרקס.

אַנימאַטעד רירעוודיק פוטער מעניו

דורך רידוסינג די וועב בלעטערער פֿענצטער צו זען דעם פוטער, איר קענען געפֿינען די 2-3 סעקשאַנז אַז דער באַניצער קענען געפֿינען אויף אַ רירעוודיק מיטל. עס איז געוויזן ביי 767 פּקס.

פּשוט פיקסט פוטער

געמאכט אין HTML און CSS איז אַ פּשוט פוטער אָן פיל פאַנפער און בליען.

רעאַגירן ווידעא כעדער

א קעפל מיט פּשוט ווידעא React.js.

ווידעא כעדער

אַנדערער כעדער מיט פּשוט ווידעא און פון גרויס קוואַליטעט.

גאַנץ סקרין ווידעא כעדער מיט מיקס-בלענד

ווייַזן אַ פול פאַרשטעלן ווידעא מיט טעקסט אויף שיכטע ניצן מישן-צונויפגיסן מאָדע.

ווידעא כעדער אַנאַמיישאַן

די אַנאַמיישאַן איז געווען קאַסטאַמייזד מיט Adobe After Effects צו זיין קאַמפּאַטאַבאַל מיט אַלע בראַוזערז. עס קען נישט אַרבעטן אויף רירעוודיק.

אָפּרופיק ווידעא כעדער מיט גראַדיענט

El גראַדיענט איז וואָס שטייט אויס צו דעם ווידעא כעדער פֿון די מנוחה.