Style ձեւեր CSS- ով

Սովորեք բարելավել ձեր տեսքը

Սովորելով CSS- ի ձեւով ոճի ձեւերի ձեւը հիանալի միջոց է ձեր կայքի տեսքը բարելավելու համար: HTML- ի ձեւերը, թերեւս, ամենաշատ բաներից են վեբ էջերի մեծ մասում: Նրանք հաճախ ձանձրալի են եւ շահավետ եւ ոմանք չեն առաջարկում շատ ոճով:

CSS- ով, որը կարող է փոխվել: CSS- ի հետ ավելի առաջադեմ ձեւով պիտակները կարող են մի քանի գեղեցիկ ձեւեր ներկայացնել:

Փոխեք գույները

Ինչպես տեքստով, դուք կարող եք փոխել ձեւի տարրերի նախապատմությունը եւ ֆոնային գույները:

Գրեթե ամեն ձեւի տարրերի ֆոնային գույնի փոխելու հեշտ ձեւը մուտքագրման վրա օգտագործվում է ֆոնի գույնի գույքը: Օրինակ, այս կոդը կիրառվում է կապույտ գույնի (# 9cf) բոլոր տարրերի վրա:

մուտքային {
background-color: # 9cf;
գույնը `# 000;
}

Միայն որոշակի ձեւի տարրերի ֆոնային գույնը փոխելու համար պարզապես ավելացրեք textarea եւ ընտրեք ոճը: Օրինակ:

մուտք, տեքստային, ընտրեք {
background-color: # 9cf;
գույնը `# 000;
}

Համոզվեք, որ փոխեք տեքստի գույնը, եթե ձեր ֆոնային գույնը մութ է: Հակապատկեր գույները օգնում են ձեւի տարրերը ավելի պարզունակ դարձնել: Օրինակ, կարմիր կարմիր գույնի տեքստը շատ ավելի հեշտ է կարդալ, եթե տեքստի գույնը սպիտակ է: Օրինակ, այս կոդը բերում է սպիտակ տեքստ կարմիր ֆոնի վրա:

մուտք, տեքստային, ընտրեք {
background-color: # c00;
գույնը `#fff;
}

Դուք նույնիսկ կարող եք ֆոնի գույն ձեւավորել տեգի ինքնին: Հիշեք, որ ձեւի պիտակը հանդիսանում է բլոկի տարր , ուստի գույնը լրացնում է ամբողջ ուղղանկյունը, ոչ միայն տարրերի տեղերը:

Դուք կարող եք ավելացնել արգելափակում տարրեր դեղին ֆոն, տարածքը առանձնացնելու համար:

ձեւը {
background-color: #ffc;
}

Ավելացնել սահմաններ

Ինչպես գույներով, դուք կարող եք փոխել տարբեր ձեւի տարրերի սահմանները: Դուք կարող եք ավելացնել մի ամբողջ սահման ամբողջ շրջանակը: Համոզվեք, որ ավելացրեք լիցք, կամ ձեր ձեւի տարրերը կպահվեն սահմանի կողքին:

Ահա 1 լիտր սեւ սահմանի կոդերի օրինակ, 5 լցված պտտել:

ձեւը {
սահման: 1px կոշտ # 000;
padding: 5px;
}

Դուք կարող եք ավելի շատ սահմաններ սահմանել, քան պարզապես ձեւը: Փոխել ներմուծման տարրերի սահմանը, դրանք առանձնացնելով.

մուտքային {
սահման: 2px dashed # c00;
}

Զգույշ եղեք, երբ մուտքագրեք սահմանների վրա մուտքագրման արկղերը, քանի որ դրանք ավելի քիչ են թվում մուտքային արկղերը, եւ որոշ մարդիկ չեն կարողանում հասկանալ, որ դրանք կարող են լրացնել ձեւը:

Միավորել Style- ի առանձնահատկությունները

Ձեւավորելով ձեր ձեւի տարրերը միտքը եւ որոշ CSS, դուք կարող եք ստեղծել գեղեցիկ տեսք, որը լրացնում է ձեր կայքի ձեւավորումը եւ դասավորությունը: