שטעלע קאָרעוו - וואָס איז עס? דיטיילד באַשרייַבונג

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

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

וואָס איז קסס?

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

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

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

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

וואָס טוט דער שטעלע פאַרמאָג?

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

וואָס וואַלועס קענען די שטעלע פאַרמאָג?

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

• שטעלע ינהעריט. דעם שטריך אַלאַוז איר צו צייכענען די דאַטן אויף די שטעלע פון די עלעמענט אַז איז אַ פאָטער. לעמאָשל, אויב איר האָבן אַ דיוו מיט אַ ספּעסיפיעד שטעלע קאָרעוו, דעמאָלט אריין אין עס מיט ימג ירשענען ווערט אויך וועט זיין שטעלן צו די קאָרעוו.
• שטעלע סטאַטיק. דעם ווערט איז געגעבן צו אַלע יסודות אויטאָמאַטיש, סייַדן סטייטיד קיין מער. די יסודות פּאַסיק אין שטעלע ווי דערמאנט אין די קאָד און זענען נישט בנימצא פֿאַר אַ פאַרשיידנקייַט פון "פריללס", אַלאַוינג צו טוישן זייער שטעלע.
• שטעלע אַבסאַלוט. דורך דעם ווערט די שטעלע פאַרמאָג איז גאַנץ אָפֿט געניצט אין קאַסעס ווו עס איז נייטיק צו שאַפֿן אַ "Floating" עלעמענט. מיט אַ געגעבן ווערט פון די פאַרמאָג נומער איז "ומזעיק" פֿאַר די אנדערע קאַמפּאָונאַנץ פון די בלאַט. אַז איז, זיי זענען עריינדזשד ווי אויב אונדזער אַבסאָלוט עלעמענט טוט נישט עקסיסטירן. ער האט זיך וועט שטענדיק זיין אין פּלאַץ, ראַגאַרדלאַס פון ווי ווייַט שוין סקראָללעד בלאַט.
• שטעלע Fixed. אין פילע וועגן, דעם ווערט איז ענלעך צו די פֿריִערדיקע איינער, אָבער, בשעת די אַבסאָלוט עלעמענט איז געבונדן צו די פאָטער, פאַרפעסטיקט ניצט בלויז די קאָואָרדאַנאַץ פון דער אויבערשטער לינקס ווינקל פון דעם בלעטערער פאַרשטעלן, יגנאָרינג די מנוחה פון די עלעמענטן וואָס פּריסידאַד עס.
• צום סוף, שטעלע קאָרעוו. דעם טיפּ וואַלועס אַלאַוז פּאַזישאַנינג עלעמענט קאָרעוו צו די אנדערע, וואָס קענען זיין נוצלעך פֿאַר קריייטינג אַן אַדאַפּטיוו מאַרקינג גערופֿן אין פּראָסט "גומע". מיט דעם פאַרמאָג, די נומער וועט "שטופּן" די אנדערע, אָן לוזינג די פיייקייַט צו טוישן זייער שטעלע אויף דעם בלאַט.

ארבעטן מיט שטעלע אין פאַרשידענע בראַוזערז

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

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

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

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

אין פאַקט, די געשיכטע פון ווי צו אַרבעטן מיט די שטעלע פאַרמאָג אין דזשאַוואַסקריפּט איז, מיר האָבן ינקלודעד בלויז פֿאַר די צוליב פון דיסאַנסי. ווייַל דעם פאַרמאָג טוט ניט האָבן קיין ספּעציעל אותיות אין דעם טיטל, איר קענען נוצן די דזשס אָן קיין ענדערונגען, למשל, צו שטעלן די div שטעלע קאָרעוו, זאָל אַרייַננעמען אַ שורה ווי דעם: דיוו.סטילע.פּאָסיטיאָן = 'קאָרעוו'.

ווי איר קענען זען, עס ס שיין פּשוט.

וואָס שטעלע קאָרעוו מעריץ ספּעציעל אכטונג?

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

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

ווען זאָל איר נוצן קאָרעוו פּאַזישאַנינג?

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

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

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

עקסאַמפּלעס פון ניצן די קאָרעוו ראַנגקינג

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

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

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

טיפּיש מיסטייקס ווען ניצן שטעלע קאָרעוו

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