נוסח פארמען מיט קסס

לערנען צו פֿאַרבעסערן די קוק פון דיין וועבזייַטל

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

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

טוישן די פארבן

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

אַ גרינג וועג צו טוישן די הינטערגרונט פֿאַרב פון קימאַט יעדער פאָרעם עלעמענט איז צו נוצן די הינטערגרונט-קאָליר פאַרמאָג אויף די אַרייַנשרייַב קוויטל. פֿאַר בייַשפּיל, דעם קאָד אַפּלייז אַ בלוי הינטערגרונט פֿאַרב (# 9 קף) אויף אַלע די עלעמענטן.

input {
background-color: # 9cf;
קאָליר: # 000;
}

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

input, טעקסט, אויסקלייַבן {
background-color: # 9cf;
קאָליר: # 000;
}

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

input, טעקסט, אויסקלייַבן {
background-color: # c00;
color: #fff;
}

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

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

form {
background-color: #ffc;
}

לייג באָרדערס

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

דאָ ס אַ בייַשפּיל פון קאָד פֿאַר אַ 1-פּיקסעל שוואַרץ גרענעץ מיט 5 פּיקסעלס פון וואַטן:

form {
גרענעץ: 1 פּקס האַרט # 000;
padding: 5px;
}

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

input {
border: 2px dashed # c00;
}

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

פאַרבינדן סטייל פֿעיִקייטן

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