html表格代碼(html表格代碼案例)
本篇文章給大家談?wù)刪tml表格代碼,以及html表格代碼案例對(duì)應(yīng)的知識(shí)點(diǎn),希望對(duì)各位有所幫助,不要忘了收藏本站喔。
本文目錄一覽:
如何用HTML來制作表格?
HTML中的表格由 table 標(biāo)簽來定義,表格是由單元格組成的,單元格可以放入文字、圖片、表格等內(nèi)容。下面,我們來看看如何用HTML來制作表格吧。
01
代碼,先用table標(biāo)簽定義一個(gè)表格,其中border表示邊框,border="1"表示邊框?yàn)?個(gè)像素,數(shù)值越大,邊框就越粗。
table border="1"
/table
02
tr元素表示表格中的行,比如創(chuàng)建兩行
tr/tr表示一行。
03
單元格
HTML表格的單元格用td標(biāo)簽表示,如下圖所示:
td語文/td
04
表格
就做好一個(gè)HTML表格,顯示圖如下:
總代碼:
body
table border="1"
tr
td語文/td
td數(shù)學(xué)/td
/tr
tr
td英語/td
td化學(xué)/td
/tr
特別提示
表格的標(biāo)簽:table、tr、td三個(gè)標(biāo)簽。
html表格居中代碼
1、首先打開vscode編輯器,新建一個(gè)html文檔,里面寫入一個(gè)外層的div,再加入一行table表格:
2、然后在上方的style標(biāo)簽中加入css樣式,設(shè)置table標(biāo)簽的樣式,table的元素具有長(zhǎng)度自適應(yīng)性,其長(zhǎng)度根據(jù)其內(nèi)文本長(zhǎng)度決定,只要設(shè)置margin屬性,讓左右設(shè)置為auto就回自動(dòng)分配剩余空間,也就是元素兩側(cè)的區(qū)域各占50%,那么元素就左右居中了:
3、最后打開瀏覽器就可以看到居中的一行表格了:
用代碼寫如下表格,HTML?
具體的代碼可以參考下面這個(gè):
!DOCTYPE html
html lang="en"
head
meta charset="UTF-8"
meta http-equiv="X-UA-Compatible" content="IE=edge"
meta name="viewport" content="width=device-width, initial-scale=1.0"
titleDocument/title
style
div{
width: 500px;
height: 500px;
background-color: blue;
margin: 100px auto;
}
/style
/head
body
/body
第一個(gè)
table border="1" width="300"
tr
td1/td
td2/td
td3/td
/tr
tr
td4/td
td5/td
td6/td
/tr
/table
第二個(gè)
table border="1" width="300"
tr
td colspan="3"合并第一行的三列/td
/tr
tr
td4/td
td5/td
td6/td
/tr
/table
第三個(gè)
table border="1" width="300"
tr
td rowspan="2"合并第一列的兩行/td
td2/td
td3/td
/tr
tr
td5/td
td6/td
/tr
/table
/html
每一個(gè)table分別對(duì)應(yīng)圖片上的要求,可以直接使用
關(guān)于html表格代碼和html表格代碼案例的介紹到此就結(jié)束了,不知道你從中找到你需要的信息了嗎 ?如果你還想了解更多這方面的信息,記得收藏關(guān)注本站。
掃描二維碼推送至手機(jī)訪問。
版權(quán)聲明:本文由飛速云SEO網(wǎng)絡(luò)優(yōu)化推廣發(fā)布,如需轉(zhuǎn)載請(qǐng)注明出處。