Երկու կամ ավելի բջիջները մեկում միավորելու համար օգտագործվում են պիտակի colspan և rowspan հատկանիշները:
Օրինակ 12.3. Սխալ բջիջների միացում
| Բջջ 1 | Բջիջ 2 | |
| Բջիջ 3 | Բջջ 4 | |
Այս օրինակի արդյունքը ներկայացված է Նկ. 12.5.
Բրինձ 12.5. Աղյուսակում լրացուցիչ բջիջի հայտնվելը
Օրինակի առաջին տողում կա երեք բջիջ, որոնցից երկուսը միավորված են colspan հատկանիշի միջոցով, իսկ երկրորդ տողը ավելացնում է ընդամենը երկու բջիջ: Սա ստեղծում է լրացուցիչ բջիջ, որը ցուցադրվում է բրաուզերում: Այն հստակ երևում է Նկ. 12.5.
Օրինակ 12-4-ը ցույց է տալիս colspan և rowspan հատկանիշների ճիշտ օգտագործումը:
Օրինակ 12.4. Միավորել բջիջները ուղղահայաց և հորիզոնական
| Բրաուզերը | Internet Explorer | Օպերա | Firefox | ||||
|---|---|---|---|---|---|---|---|
| 6.0 | 7.0 | 7.0 | 8.0 | 9.0 | 1.0 | 2.0 | |
| Աջակցվում է | Ոչ | Այո | Ոչ | Այո | Այո | Այո | Այո |
Այս օրինակի արդյունքը ներկայացված է Նկ. 12.6.
Բրինձ 12.6. Միավորված բջիջներով սեղան
Այս աղյուսակն ունի ութ սյունակ և երեք տող: «Internet Explorer», «Opera» և «Firefox» բառերով որոշ բջիջներ համակցված են ՝ երկու, և որտեղ ՝ երեք բջիջ: Ուղղահայաց միաձուլումը կիրառվում է «owsննարկիչ» պիտակավորված բջիջում:
Ես ձեզ մանրամասն և մանրամասն կպատմեմ, թե ինչպես կարելի է բջիջները ուղղահայաց և հորիզոնական համատեղել աղյուսակներում:
Այս հոդվածում մենք չենք բացատրի html աղյուսակներ ստեղծելու սկզբունքները, այս գիտելիքները ձեռք բերելու համար անցեք մեր HTML դասընթացը:
Աղյուսակի բջիջները համատեղելու համար պիտակին տրվում է երկու հատկանիշ
Ոմանք դժվարանում են օգտագործել այդ հատկանիշները, բջիջների միաձուլման հետ կապված խնդիրներ:
Colspan և rowspan հատկանիշները որպես պարամետր վերցնում են 0 -ից 1000 -ի ամբողջ արժեքներ: Ահա մի փոքր օրինակ, թե ինչպես կարող եք միավորել աղյուսակի բջիջները:
Առաջին հայացքից իրականացվում է ոչ շատ բարդ կառույց, բայց նայելով առատությանը
Մենք ձեզ առաջարկում ենք բջիջները համատեղելու բազմակողմանի և շատ հարմար եղանակ:
Սկզբից պատրաստեք ձեր ապագա սեղանի դատարկը ՝ այն ներկայացնելով բոլոր բջիջները բաժանված: Դա կարող է լինել սեղան 3x3, 6x10եւ այլն Յուրաքանչյուր բջիջ կտանք իր համարը ՝ սկսած հաշվել ձախից աջ և վերևից ներքև:
Եկեք վերլուծենք այս մեթոդի միջոցով վերը նշված աղյուսակի ստեղծումը:
Ահա այսպիսի տեսք կունենան մեր ձևանմուշի ծածկագիրը և ձևանմուշը.
| 1 | 2 | 3 | 4 |
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
| 1 | 2 | 3 | 4 |
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
Դուք պետք է միավորեք բջիջները 1,2,3 թվերով հորիզոնական: Դա անելու համար 1 -ին բջջի ծածկագրում ավելացրեք colspan հատկանիշը 3 արժեքով: Եվ հեռացրեք
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
Այժմ մենք պետք է միացնենք 9 և 13 բջիջները ուղղահայաց: Մենք իրականացնում ենք նմանատիպ ընթացակարգ. Սահմանել տողերի հատկանիշը 9 -րդ բջիջին `2 -ով, ջնջել բջիջը 13 -րդ համարից, գրել այն բջիջների թվերը, որոնցից այն բաղկացած է միավորված բջիջից:
Սա կփոխի մեր ծածկագիրը և աղյուսակի տեսքը.
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11 | 12 |
| 14 | 15 | 16 | |
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11 | 12 |
| 14 | 15 | 16 | |
Մնում է 11,12,15,16 բջիջները միավորել մեկում: Դա անելու համար թիվ 11 բջիջում գրեք colspan = "2" rowspan = "2" հատկանիշները: Մենք հեռացնում ենք 12,15,16 բջիջները ծածկագրից: Համակցված բջջային համարներում գրում ենք 11,12,13,14:
Սա կփոխի մեր ծածկագիրը և աղյուսակի տեսքը.
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11,12,15,16 | |
| 14 | |||
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11,12,15,16 | |
| 14 | |||
Այսքանը, մենք ստացանք բնօրինակ աղյուսակը, այժմ բջիջները կարող են լրացվել ձեզ համար հարմար տեղեկատվությամբ:
Հուսով ենք, որ դուք հասկանում եք համակցված բջիջներով բարդ աղյուսակներ ստեղծելու սկզբունքը:
HTML աղյուսակներն ունեն երկու գործառույթ: Առաջինը հենց աղյուսակներն են, այսինքն `տեղեկատվության ելքը` աղյուսակի տեսքով: Եվ երկրորդը էջի դասավորությունն է: Բովանդակության առանձին կտորներ տեղադրվում են սեղանի տարբեր բջիջներում և դրանով իսկ հայտնվում էջի ճիշտ տեղում:
Սեղանի ստեղծում
Եկեք նայենք, թե ինչպես ստեղծել աղյուսակ HTML- ում: Դա արվում է պիտակի միջոցով
| տող է ավելացնում բջիջ: Հիշեք, որ փակեք պիտակները: Օրինակ, եկեք ստեղծենք այսպիսի աղյուսակ.
Որպեսզի սեղանի շրջանակները տեսանելի լինեն, պիտակը
|
