简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > HTML Tutorial > body text

How to set the horizontal span of cells in html5

青灯夜游
Release： 2021-12-17 16:38:48
Original
2602 people have browsed it

In HTML5, you can use the colspan attribute of the cell element (td or th) to set the horizontal span of the cell. This attribute can define the number of columns that the cell should span. The syntax "

" or " ".

How to set the horizontal span of cells in html5

The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.

In HTML5, if you want to set the horizontal span of a cell, you can use the colspan attribute. (colspan attribute acts on td or th elements)

The colspan attribute is used to define the number of columns that the cell should span.

Syntax:

<td colspan="number">
<th colspan="number">
Copy after login
ValueDescription
number

specifies the number of columns the cell should span.

Comment: colspan="0" Tells the browser to make the cell span to the last column of the column group (colgroup).

Example: 

<!DOCTYPE <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>设置单元格列跨度</title>
	</head>
	<body>

		<table width="550" border="1" cellspacing="0" cellpadding="5">
			<tr>
				<th colspan="2" align="center">存款（1~3月）</th>
			</tr>
			<tr>
				<td>一月</td>
				<td>3000 元</td>
			</tr>
			<tr>
				<td>二月</td>
				<td>5000 元</td>
			</tr>
			<tr>
				<td>三月</td>
				<td>3500 元</td>
			</tr>
			<tr>
				<td colspan="2">总计：11500 元</td>
			</tr>
		</table>
	</body>
</html>
Copy after login

How to set the horizontal span of cells in html5

Related recommendations: "html video tutorial"

The above is the detailed content of How to set the horizontal span of cells in html5. For more information, please follow other related articles on the PHP Chinese website!

Related labels：
html5 sheet
source：php.cn
Previous article：How to make pictures move up and down in html Next article：How to set text italics in html5
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
How to set HTML5's required attribute using Javascript? I'm trying to mark a text input box as required in Javascript. <inputid="edName&qu...
From 2023-10-13 08:52:25
0
2
317
Problem with not getting accurate mouse coordinates: using HTML5 canvas when resizing the page I want to create this pixel effect from a front-end expert. Although I can achieve the ent...
From 2023-09-12 12:20:33
0
1
280
HTML5 video M3U8 encoded with Base64 I want to add a base64 encoded M3U8 file in the Video tag of HTML5, how can I do it<!DO...
From 2023-09-09 23:07:18
0
1
247
vue.js/bootstrap: onclick event method not called, error "Variable not found: updateDocument" I'm new to front-end development but have basic understanding of HTML5, CSS and Javascript...
From 2023-09-09 20:06:48
0
1
362
Remove closing slash '/' from image tag in XHTML I have a string txt1 that stores an image. Its value is in XHTML format, i.e. the element ...
From 2023-09-06 12:15:38
0
1
240
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！