CSS: սեղանի դիզայն: օրինակները գրանցման

Կատարելու սեղաններ CSS - Դասի հետաքրքիր եւ պատասխանատու: Մոտեցում այս բիզնեսում պետք է գրագետ, իմացությամբ բոլոր հնարավոր ոճերի. Ի լրումն, դա անհրաժեշտ է տիրապետել մի զգացում գեղեցկությունը, որպեսզի ոչ թե վախեցնելու դուրս իրենց ստեղծագործական այցելուներին:

Աղյուսակները կարող է փոխակերպել գրեթե ամեն ինչ: Գեղեցիկ դիզայն ներառում է օգտագործման CSS սեղանների նախագծման սահմաններում, սեղանի ֆոնին, բջջային ֆոնի, այդ բացը նրանց միջեւ եւ այլն: Համարում են առավել հիմնական:

սեղան սահմանը

CSS սեղանի ոճը դիզայն միշտ ներառում է խաղը սահման (շրջանակ): Բոլոր default սեղաններ չեն եզրագծերը շրջանակ: Այսինքն, դա հավասար է 0 պիքսել. Բայց դա կարող է ուղղել սեփականության սահմանին:

Դուք կարող եք նշեք արտաքին շրջանակ ողջ սեղանին:

սեղանի {սահման: 3px ամուր սեւ. }

Thanks Այս գծի բոլոր սեղանների կայքում, որը օգտագործում է այս ոճը, սեւ շրջանակ: Նկատի ունեցեք, որ հայ-թուրքական սահմանը միայն եզրեր, բայց ոչ ներսում սեղանի վրա: Համար բջջային գծերի եւ շրջանակի այլ բան նշված չէ:

րդ, TD {սահմանային: 3px ամուր սեւ;}

Հաստությունը եւ գույնը, դուք կարող եք նշեք ցանկացած. Հիշեք, որ սահմանները չեն կրկնապատկվեց, երբ splicing բջիջները:

Որ բառը նշանակում է ամուր շարունակական գրանցում: Դուք կարող եք նշեք այլ արժեքներ:

այն առավել հաճախ օգտագործվում է ամուր շրջանակ, քանի որ այն ավելի գրավիչ տեսք եւ չի շեղել ուշադրությունը բուն բովանդակությունից կայքում.

սահմանը գույքը կարող է նշված նաեւ խորհրդի. Այս սահմանը կարող է լինել միայն սահմանվել վերեւում, ներքեւում, ձախ կամ աջ կողմում: Քանի որ որոշ դեպքերում դա ոչ մի իրատեսական տարբերակն հետ շրջանակի համար ողջ սեղանի միանգամից.

սեղանի {սահմանային վերեւ: 1px solid կարմիր. }

Այսպիսով, դուք կարող եք սահմանել շրջանակ է վերեւում սեղանին միայն. Նմանապես ցանկացած այլ կուսակցությունների, ոչ թե պարզապես սկիզբ Գրէ: Աջ, ձախ կամ ներքեւի.

սեղան վերնագիր

Աղյուսակ վերնագիր կարելի է ձեւավորել օգտագործելով հատկորոշիչը <վերնագիր>: Այս հատկորոշիչը կարող է լինել CSS է գրանցվել շատ հատկությունների համար տուգանք- tuning. CSS- ը սեղանի ձեւավորում լավ է, քանի որ դա հնարավոր է մանեւրել այն տարրերի ճանապարհ եք ուզում.

Այս վերնագիրն դրսեւորվում է նույն կերպ, որպես ստանդարտ գրքերի (ինչպես, օրինակ, «Աղյուսակ 1»):

Դուք կարող եք նշեք, գտնվելու վայրը, պաշտոնը եւ գույքի վերնագիր-կողքի (վերին կամ ստորին): Aligning ձախ կամ աջ սահմանվում է սեփականության text-align:

ֆոնային սեղաններ

Նախապատմություն սեղանին կարող է լինել ցանկացած գույնի կամ օրինակը. Գույն սահմանում է անշարժ գույքի ֆոնի-գույն. Անունները հատկությունների լիովին համահունչ օգտագործման համար են խոսքի. Այն նպաստում է պահելու շատ անգամ:

Գույնը կարող է նշված որպես անունով, եւ տարբեր encodings: Բացի այդ, դուք կարող եք նշեք հետեւյալը.

• Թափանցիկ - Թափանցիկ.
• Ժառանգեն - գույն նույնն է, քանի որ ծնողի տարր.
• Նախնական - լռելյայն.

Տարբերակ թափանցիկությամբ կարող է օգտագործվել այն դեպքերում, երբ բոլոր սեղանները են տեքստի CSS ֆայլի են արված մեկ գունավոր, բայց այս դեպքում անհրաժեշտություն չկա:

Ի լրումն, ապա հետին պլանի կարող է լինել մի պատկեր: Որպեսզի դա անել, ի ոճով սահմանվում ֆոնային պատկեր սեփականության. Այն ճանապարհը, նման է սա:

URL ( 'URL')

Ճանապարհը դեպի ֆայլը կարող է լինել կամ հարաբերական կամ բացարձակ:

Ավելի բարդ լրացնել կարելի է անել մի գրադիենտ:

• գծային-գրադիենտ ();
• ճառագայթային գրադիենտ ();
• կրկնելով-գծային-գրադիենտ () եւ կրկնելով-ճառագայթային գրադիենտ () - թեքություն կրկնեց.

ֆոն բջջային

Բացի ֆոնի ընդհանրապես, դուք կարող եք նշեք մի գծավոր ֆոն սյունակներում կամ շարքերում: Գրանցման համար սեփականության օգտագործվում է շատ հաճախ, քանի որ տեսողական տարանջատումը գծերի ավելի հեշտ է կարդալ տեղեկատվություն:

Ի լրումն փոփոխման, եւ դուք կարող եք նշեք մի շարք կոնկրետ սյունակի կամ անընդմեջ: Օրինակ, նման:

• tr: n- րդ երեխան (նույնիսկ) {...} - նշել միահյուսված.
• tr: n- րդ երեխան (1) {...} - նշումը հատկությունների որոշակի անընդմեջ.
• TD: n- րդ երեխան (նույնիսկ) {...} - վկայում է ընդմիջվող սյուները.
• TD: n- րդ երեխան (1) {...} - ցույց է տալիս, հատկությունների որոշակի սյունակում:

Բացի այդ, հաջորդականությունը եւ համարները կարող է նշված առաջին (TD: առաջին երեխան), կամ վերջին (TD: նախորդ երեխա):

Այդ բացը միջեւ բջիջների

CSS- ով, սեղանի դիզայնի թույլ է տալիս Ձեզ հեռացնել տարածքներ միջեւ բջիջների. Ըստ նախնականի են նրանք: Օրինակ, եթե դուք սահմանել շրջանակ է սեղանի առանց ընդլայնված հեռավորությունը միջեւ սահմաններում, ապա դա կլինի այստեղ, այս արդյունքը:

Համաձայն եմ, որ նայում է շատ գեղեցիկ, եւ դա ոչ թե հարմար է կարդալ. Օգտագործողները կունենա ծածանք աչքերում, քանի որ այս. Հեռացնել այս բացերը կարող է լինել գրելով ընդամենը այդպիսի մի գիծ է սեղանի ոճով:

սահմանային փլուզումը: փլուզում

Բայց այն նաեւ պատահում է, որ հեռավորությունը, ընդհակառակը, պետք է ավելանան: Ավելին, չափը բացերը կարող է նշված, ինչպես նաեւ միջեւ սյուների եւ տողերի արանքում: Ցույց են տալիս, որ մի արժեք (փոխարեն փլուզվել):

սահմանային փլուզումը առանձին

Սակայն նման գործողություն ցույց է տալիս, որ դա անհրաժեշտ է առանձնացնել բջիջները: Քանի որ դա եղել է նրանց բաժինը, նշված հավելյալ գույքի:

սահմանային spacing: 20px.

Եթե դուք ուզում եք նշել մի այլ հեռավորությունը միջեւ շարքերում ու սյուները, դա ցույց է տալիս, երկու բան:

սահմանային spacing: 10px20px.

Որ տարբերությունը բրաուզերների

Հիշեք, որ ի CSS դիզայնի սեղաններ կարող է նայել տարբեր են, կախված բրաուզերի. Հատկապես վատ է այն դեպքն է հին տարբերակները, որ նորարարությունները CSS- ում չի աջակցվում:

Վերը նշված է մի օրինակ, կոմպակտ thicknesses մինչեւ թվային արժեքների:

Համար, այս, օրինակ, հաստությունը շրջանակներում համար հաստատուններ:

սահմանային ոճերը նույնպես տարբերվում մեծապես.

Հետեւաբար, զարգացումը մշտապես տեսնել արդյունքը տարբեր բրաուզերների.

CSS- ով նախագծման սեղաններ խորհուրդ է տրվում ստուգել այն տեսակի բրաուզերի. Մասնավորապես մեծ խնդիր օգտագործվում է օգտագործողների հետ ավելի հին տարբերակների Internet Explorer.

Շատ առաջադեմ մշակողները կարող, կախված բրաուզերի միացնել բոլորովին տարբեր CSS ֆայլեր. Եւ ինչ - որ մեկը ստիպում է ստուգել յուրաքանչյուր կամ որոշակի առանձնահատուկ ոճը (դասի).

Շատ խնդիրներ առաջանում են ստվերից:

CSS: սեղանի ձեւաչափով Օրինակներ

Գրանցում կարող է բավականին բազմազան: Այն ամենը կախված է ամբողջ կայքում եւ իր դիզայնի. Բոլորը պետք է համատեղել ու բազմերանգ գույները: Նաեւ այն կազմում է մի մեծ դեր ու համը մշակողի. Զգացում գեղեցկությամբ բոլորը տարբեր են:

Մենք տալիս ենք որոշ օրինակներ տարբեր սեղանների. The գործիչ Վերը ցույց է տալիս, որ օգտագործումը կարգավորում եւ խաղալ հետ ֆոնային գույն եւ սահմանին.

Շատերը կլինի հետաքրքիր օրինակ է գեղեցիկ կոկիկ դիզայնի, որը չի կտրել տեսողության օգտվողներին. Այս մարմնացումը տեղին է գրեթե ցանկացած իրավիճակում.

Այն եզրեր կարող են կատարվել կլորացված. Այն նայում շատ հաճելի.

եզրափակում

Ինչպես դուք կարող եք տեսնել, տեսքը սեղանները CSS կան բազմաթիվ գործիքներ: Յուրաքանչյուր պարամետր է նաեւ մի հսկայական քանակությամբ արժեքի տարբերակները. Եթե դուք օգտագործում եք այն ամենը միանգամից, դուք կարող եք ստեղծել գլուխգործոցներ: Հատկապես, եթե դուք անեք հարմարվողական դիզայն բոլոր բրաուզերների.

Հիմնական բանը, որ դիզայնի չեն չափազանցել այն հետեւանքների. Ամեն ինչ պետք է արվի չափավոր. Սկզբում դասավորությունը ցանկանում եք փորձարկել եւ օգտագործել բոլոր իրենց գիտելիքները անմիջապես. Որպես արդյունքում սեղանին են oversaturated հատկությունները. Փորձում է խուսափել այս սխալները:

Ավելին, որոշ պարամետրերի կարող է խանգարել միմյանց հետ: Օրինակ, կարիք չկա, որպեսզի նշեք ֆոնի գույնը է սեղանի վրա, իսկ եթե կա դեռեւս սահմանել ֆոնային պատկեր, որը համընկնում է նշված գույնը: