在前端開發(fā)中時,為了使網(wǎng)頁中的數(shù)據(jù)能夠有條理地顯示,可以使用表格對網(wǎng)頁進行規(guī)劃。在Word文檔中,可通過播入表格的方式來創(chuàng)建表格,而在HTML網(wǎng)頁中要想創(chuàng)建表格,需要使用相關(guān)的表格標記才能創(chuàng)建表格。在HTML網(wǎng)頁中創(chuàng)建表格的基本語法格式如下所示。
?
在HTML網(wǎng)頁中創(chuàng)建表格的基本語法格式如下所示。
????????????單元格內(nèi)的文字 | ????
在上述的語法中,包含3對HTML標記,分別為
、
|
、
| ,它們是創(chuàng)建表格的基本標記,缺一不可。
用于定義一個表格;
|
用于定義表格中的行,必須嵌套在
標記中,
| 用于定義表格中的單元格,也可稱為表格中的列,必須嵌套在
|
標記中。接下來,通過一個案例來演示
標記的使用。在chapter01文件夾中創(chuàng)建一個HTML文件htmlDemo05,其關(guān)鍵代碼如文件所示。????????????姓名 | ????????語文 | ????????數(shù)學 | ????????英語 | ????
????????????itcast | ????????95 | ????????80 | ????????90 | ????
標記的border 屬性會為每個單元格應(yīng)用邊框,并用邊框圍繞表格。這里將 border 的屬性設(shè)置為1,單位是像素,表示該表格邊框的寬度為1像素。如果 border 屬性的值發(fā)生改變,那么只有圍繞表格的邊框尺寸會發(fā)生變化,表格內(nèi)部的邊框還是1像素寬。如果將border的屬性值設(shè)置為0或者刪除border屬性,將顯示沒有邊框的表格。使用瀏覽器打開文件,顯示結(jié)果如圖1所示。
有邊框表格的顯示效果
將border屬性值設(shè)置為0,保存后刷新頁面,瀏覽器的顯示結(jié)果如圖所示。
無邊框表格的顯示效果
從上圖的顯示效果可以看出,表格中的內(nèi)容依然整齊有序地排列著,但是這時已看不到邊框。在實際開發(fā)中,建議使用CSS來添加邊框樣式和顏色。
如果你對前端開發(fā)感興趣請點擊云和數(shù)據(jù)官網(wǎng)我們整套完善的前端開發(fā)教程包括線上和線下,此外我們還有專門的客服老師回答您所關(guān)心的問題。
云和數(shù)據(jù)ICT職業(yè)教育發(fā)揮公司產(chǎn)業(yè)化優(yōu)勢與技術(shù)積淀,整合國內(nèi)外優(yōu)秀師資,累計自主研發(fā)230余項教輔、教材,300余項實踐教學案例與實訓平臺,采用六位一體項目制教學模式,年培養(yǎng)高端ICT技術(shù)人才超10000人,累計為企業(yè)輸送高端泛ICT技術(shù)人才超9萬人,學員60%來自于口碑推薦。云和數(shù)據(jù)人才培養(yǎng)技術(shù)方向涵蓋大數(shù)據(jù)、JAVA軟件工程、UI用戶體驗設(shè)計、前端開發(fā)、軟件測試、智能制造、虛擬現(xiàn)實、云計算、人工智能九大方向,以九大精品課程為基礎(chǔ),八大就業(yè)基地為依托,一次就業(yè)率99.02%,61.9%就業(yè)薪資超1W,以大數(shù)據(jù)為首的精品專業(yè)平均薪資13.25K。
Copyright ? 2013-2021 河南云和數(shù)據(jù)信息技術(shù)有限公司 豫ICP備14003305號 ISP經(jīng)營許可證:豫B-20160281