Как да направите HTML обединяване на клетки в таблица
Здравейте, днес аз ще ви кажа как да направите HTML обединяване на клетки в таблица, хоризонтално и вертикално.
Особено не се притеснява отива, аз ще се създаде проста маса с три реда и четири клетки на всеки ред. За тях, за да задам един прост стил, всичко показва правилно.
маса граничен колапс: колапс;
>
TD граница: 1px плътно черно;
ширина: 60px;
височина: 50px;
>
Обединяване клетки хоризонтално
Да започнем с това, защото този метод е по-лесно. Да речем, че искате на първия ред от четири клетки се сляха в едно. Това може да стане с помощта на ColSpan атрибут:
- Изпишете желания клетъчен атрибут ColSpan = "брой клетки, което искате да се слеят"
- Премахване на всички ненужни клетка
Обърнете внимание на тази част от кода. Що се отнася до първата клетка в редица набор ColSpan 4. В действителност, тя се провежда четири клетки, и по тази причина, следните 3 в номера, който искате да изтриете, те просто не се нуждаят днес.
Ако те не са отстранени, в редица форми, колкото 7 клетки, и разбира се, че ще бъде много по-широк, отколкото тези двамата.
Сега ние ги премахнете и да се види, че всичко е добре показва.
Комбинирането на вертикално
Това е малко по-сложно и се извършва на същата технология се използва само атрибут наречен rowspan и изтриване на желаната клетка в колоната, което трябва, а не на брой, което е малко усложнява проблема, но това всъщност е лесно, ако се разбере същността на поста.
Нека да се съчетаят най-късно в редица клетка 2 и 3. За тази цел, последната клетка в редица 2 Запис rowspan = "2". Сега трябва в редица 3, за да изтриете последната клетка. Ако не го направите, след това отново, ще излезе допълнително клетка, която в голяма степен ще развалят външния вид на нашата маса.
Комбинирането на двете страни
Една клетка може да се настрои така атрибути. Нека също да видим как тя работи. Обединяването на единична клетка 2 в първата клетка на серия 2, и първите две - 3. Общият брой на клетките 4 са комбинирани в един.
В такъв случай, клетката на втория ред да получа и атрибут на втория ред се изтрива клетка след него, третият - първите две.