שאפן סקראָללאַבלע אינהאַלט אין הטמל 5 און קסס 3 אָן מאַרקווע

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

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

New CSS3 פּראָפּערטיעס

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

אָוווערפלאָו-נוסח
די אָוווערפלאָו-נוסח פאַרמאָג (וואָס איך אויך דיסקאַסט אין דעם אַרטיקל CSS Overflow) דיפיינז די בילכער סטיל פֿאַר אינהאַלט וואָס אָווערפלאָווס די אינהאַלט קעסטל. אויב איר שטעלן די ווערט צו צייכענען-שורה אָדער מאַרקע-פאַרשפּאַרן דיין צופרידן וועט רוק אין און אויס צו די לינקס / רעכט (מאַרקע-שורה) אָדער אַרויף / אַראָפּ (מאַרקע-בלאָק).

צייכן-נוסח
דעם פאַרמאָג באשטייט ווי די אינהאַלט וועט קער אין מיינונג (און אויס).

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

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

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

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

מאַרקווע-דירעקטיאָן דעטאַילס

אָוווערפלאָו-נוסח שפּראַך דירעקטיאָן פאָרויס פאַרקערט
מאַרקווע-שורה ltr לינקס רעכט
rtl רעכט לינקס
מאַרקווע-בלאָק אַרויף אַראָפּ

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

בלעטערער סופּפּאָרט פון די מאַרקע פּראָפּערטיעס

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

CSS3 ווענדאָר פּרעפיקס
אָוווערפלאָו-רענטגענ: מאַרקע שורה; אָוווערפלאָו-רענטגענ: -webkit-marquee;
צייכן-נוסח -webkit-marquee-style
מאַרקווע-שפּיל-ציילן -webkit-marquee-repetition
צייכענונג-ריכטונג: פאָרויס | פאַרקערט; -webkit-marquee-direction: פאָרווערדז | צוריקצימער;
מאַרקווע-גיכקייַט -וועבקיט-מאַרקווע-גיכקייַט
קיין עקוויוואַלענט -webkit-marquee-increment

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

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

{
ברייט: 200 פּקס; הייך: 50 פּקס; ווייַס-פּלאַץ: נאָענט;
לויפן;
אָוווערפלאָו-רענטגענ: -webkit-marquee;
-webkit-marquee-direction: פאָרווערדז;
-webkit-marquee-style: מעגילע;
-webkit-marquee-speed: נאָרמאַל;
-וועבקיט-מאַרקע-ינקראַמאַנט: קליין;
-webkit-marquee-repetition: 5;
אָוווערפלאָו-רענטגענ: מאַרקע שורה;
צייכענונג-ריכטונג: פאָרויס;
מאַרקווע-נוסח: מעגילע;
מאַרקווע-גיכקייַט: נאָרמאַל;
מאַרקווע-שפּיל-ציילן: 5;
}