HTML туралы сабақ. біріктіру жасушалары

HTML кестелер - өте ыңғайлы элемент. Олардың көмегімен сіз ештеңе істей аласыз. Әрине, негізгі мақсаты - кестеде ақпаратты орналастыру. Бірақ сайттар әзірлеушілер одан әрі кетті. Бір уақытта ол торап арқаулық жүйесін жасау үшін кестені пайдалануға өте танымал болды. Енді мамандар мұны тырысады емес.

Кестелер, өйткені атрибуттарды үлкен санының олардың кеңінен қолдануға тапты. Мысалы, өте пайдалы меншік жолдарды немесе бағандарды үйлестіре айналды.

Теориясына кіріспе

colspan және rowspan: HTML жылы жасушалар одағы екі атрибуттары арқылы жүреді. Олар TD тегтің көрсетілген.

біз тақырыпқа Қопа бұрын бізге алдымен, әрбір кестенің құрылымын қарастырайық. жасуша - әрбір кестеде сызық, және оған бар. бастапқыда, барлық кестелер жасушалар саны бірдей болуға тиіс екенін есте сақтаңыз.

көрсетілген екі жолдар жоғарыда және үш жасушалардың әр фигура. Ол ортақ үстел болып табылады. Егер сіз қандай да бір қорапта болса, жасушалар аз санын теріңіз, үстел барлық дұрыс көрсетілмеуі болады «, жылжыту» болып табылады.

HTML-кесте: Ұяшықтардытігіненбіріктіру және көлденеңінен

көрсетуге арналған ұялардың немесе Ғасырлар аз саны біріктіру бір нәрсе бар болса ғана пайдалануға болады. Бірақ оның орнына жақын көршіміз жойылады элементтің сіз қосымша төлсипатты көрсету қажет шыңында. Егер сіз бағандарды біріктіру болса, онда colspan, жолдар, содан кейін rowspan егер. Егер төлсипатының мәні біріктірілетін элементтердің санын көрсетеді.

Сіз басына жақын элемент оны көрсету қажет екенін ескеріңіз. Сіз ұяшықты 1 және 2 біріктіруге келеді Мысалы, егер жоғарыдағы суретте, сіз екі мәнімен ұялы 1 colspan атрибуты көрсету керек. Және бұл маңызды емес позиция нөмірі 2 немесе 3, жою.

төменгі сызық Сіз бұл қанша ғарыш ұяшықты айтып, бұл. Әдепкі мәні 1.

ұяшықтарын тігінен HTML-кестені біріктіру сол принцип бойынша орын алады. Жай алып кеңістік ретінде тігінен қаралатын болады. төмендегі суретті қараңыз.

Мұнда, саны 43 ұялы екі жолдарын қабылдайды. Бұл әрекетті орындау үшін, сіз атрибут rowspan көрсетіңіз. Тек есте:

• Жол - жол.
• Col - баған / баған.
• Span - қауымдастығы.

тіпті оны білмей, қалай болғанда да түсіну мүмкін, сондықтан жасаушылар, адам мүмкіндігінше тілді алып тырыстық.

HTML жылы жасушалар одағы екі бағытта жүргізілуі мүмкін: тігінен және көлденеңінен. Бұл әрекетті орындау үшін, біз екі атрибут көрсетіңіз.

Жоғарыда көрсеткіш дәл осы болып табылады және бірлестік істей алады, деп мәлімдеді: жолдарды, бағандарды немесе екеуі де жолдар мен бағандарды.

HTML: ұяшықтарды біріктіру. мысалдар

АҚШ-тың ірі кестелерде неғұрлым күрделі мысалдар кезең қарастырайық. Сол жақтағы Төменде тұрақты кестенің бастапқы нұсқасын орнатыңыз. Құқығы - екінші қатарда екі ұяшықтар комбинациясы бар нұсқа. Сондықтан анығырақ және HTML-кодын салыстыруға оңай.

Сіз сондай-ақ ұяшықтың орталығында үш біріктіруге болады. Бірінші жағдайда colspan атрибуты ұялы №1 көрсетеді. Мұнда, бірінші өзгеріссіз болады, ал екінші үш тең colspan, қосылған.

Егер сіз бір үшін қатарынан барлық ұяшықтарды біріктіру келсе, онда бірінші colspan = көрсетеді '5' төрт ПТ-ны алып тастау.

Өздеріңіз көріп отырғандай, шын мәнінде, бәрі қарапайым. күрделі ештеңе жоқ. Ең бастысы, мұқият, алғаш рет бастап кестелердің барлық кедергілерді түсінуге, содан кейін ешқандай проблемалар туындамауы тиіс.

Сайт шеңберінде ретінде Кесте

HTML жылы жасушаларының одағы әрқашан (Word немесе Excel бағдарламасында) ақпаратпен тұрақты кестелер үшін пайдаланылмайды. Сайт жиі дизайнерлер, бірақ сауалнамалар сайттар макеті оларды пайдаланды бұрын.

Мысалы, сайттың орналасуын қарайды. Бұл дизайн - өте қарапайым және қарабайыр. Бірақ сіз анық бірлестігінің пайдалануды көрсете алады.

екі жасушаларының әр үш жолдар үстел бастапқыда болды. Содан кейін, сайттың логотипін орналастыру, алғашқы қатарынан екі жасуша біріктірілген болатын. төменгі сызық «жертөле» орналастыру үшін солай етуге болады.

Арқасында өз орнына ол дизайн элементтерін орналастыру мүмкін, және ештеңе оның шектерін қалдырмайды. Бұл өте ыңғайлы және қарапайым. Сондықтан, бұл соншалықты танымал болды. Енді, бұл DIV тег бұғаттауларын жасау ұсынылады.

қорытынды

Ал HTML кестеде ұяшық біріктіру екенін есте, сіз ұнайды кез келген жасай алады. Ол барлық сіз және сіз оны тамашалауға келеді қалай байланысты. Маңыздысы сол, шатастырмау емес. Сіз бірлестіктердің үлкен санымен ірі кестені жасау қажет болса, ол қағазына бойынша немесе Paint оны барлық аударғым ұсынылады. Верстальщика бастауыш оңай болады.

Кезде пайда тәжірибесі, бұл операциялар оңай басы орындауға болады.