Как да се съчетаят в клетка от таблица HTML една

Как да се съчетаят клетки в HTML

И сега, да бъдат изключително внимателни, тъй като ние се обръщаме към най-трудната от всички въпроси, които се отнасят до създаването на таблици. Става дума за това, как да се съчетаят клетките в HTML таблица.







Обединяване на клетки в редове

Главно описваме как да се съчетаят редовете на таблицата в HTML. Това ще помогне да се припише ColSpan. който работи с такива етикети като и .

Например, можете да припише стойност на атрибут 2. В резултат на клетката, към която маркерът се увеличава плавно в хоризонтална посока от 2 пъти, измествайки съседен. Но репресирани клетка не е да ходя никъде, той присъства в таблицата, само в една напълно нова колона, които трябва да бъдат отстранени.

Нека да практикуват как да го направя. Така че нека да започнем. Нека се опитаме да създадете таблица, подобно на следното:

Според по-горе правила, ние трябва да се създаде линия, добавете една проста клетка, и последвано от една и съща линия, за да добавите клетка, която ще заеме мястото на две прости клетки.






В следващия ред, ние просто трябва да добавите три проста клетка. Звучи лесно, нека да превъртите напред нашите идеи в кода:

Това е! Абсолютно нищо лошо!

Обединяване на клетки в колони

В вертикална посока на клетката да се съчетаят малко по-сложно, отколкото в хоризонтала. Този проблем е решен с помощта на rowspan атрибут. който се дължи на маркери или .

Ако този атрибут е настроен на 2. Тази клетка се е увеличила по размер и по вертикалата, до следващия ред. Клетката се намира под тази, която се увеличава по размер, е правилно, което отново се образува отделна колона. И, за да го премахнете, просто трябва да се отстрани в клетката.

Нека сега се създаде следната таблица:

Ние мислим за това, което трябва да се направи. Трябва да добавим клетка, която заема вертикално пространство в 2 пъти повече, отколкото просто. след това добавете една и съща линия два прости клетки.
Отидете на следващия ред. Тук ние току-що са били заети място на върха на клетката. Преминете към следващия раздел и да видим, че ние сме в този ред може да се добавя само две прости клетки. Трансфер до кода:

Отново нищо фантазия.

Едновременно асоциация вертикално и хоризонтално в една таблица

В реални ситуации, този тип маса са много чести. Опитайте сами с помощта на предложения от нас метод на разсъждение, създадени с HTML-код, следната таблица:

Какво? Прочетете по-нататък, без дори да се опитва? Ами нека да го опитате, хленчих!

Ако все още не работят, а след това тук е отговорът: