010

(3 / 11)
⚡ 登入後報錯可獲 3天VIP 免廣告——立即登入

-9所示。

圖3-9 案例一效果

案例一的源代碼如下。

解析:這是一個4行4列的表格,因此在正常情況下是4個tr,每個tr裡麵有4個td。但是,因為需要讓第2行第2列和第3行第2列合並,屬於行合並,因此需要在第2個tr中的第2個td上設置rowspan=“2”,表示在這個位置向下合並一個單元格。這樣一來,便需要在下一個tr上的對應位置刪去一個td,表示合並。

再來舉一個稍微複雜的案例。

【案例二】

案例二的運行結果如圖3-10所示。

圖3-10 運行結果

源代碼如下。

利用這些table標簽,以及行合並、列合並的技巧,可以實現各種各樣的網頁布局,其實,在早期的網頁開發中,table標簽除了用來顯示一些列表數據外,還可以用來布局。案例三就是用table標簽製作的簡單布局。

【案例三】

案例三的運行結果如圖3-11所示。

圖3-11 運行結果

源代碼如下。

3.1.7 表單元素

相信你在瀏覽網頁的時候,經常會看到一些表單。比如,當你注冊某一個網站的會員時,就需要填寫一個表單,該表單裡麵有很多輸入框,需要你在對應的輸入框內填寫自已的用戶名、密碼、郵箱等信息,還有一些表單元素是單選按鈕、下拉框、複選框。正是由於表單的存在,使得網頁和用戶之間產生了一些交互元素。

關於form表單標簽的介紹如下。

描述:

表單標簽用來在htmL頁麵中創建一個表單,表單標簽在瀏覽器上沒有任何顯示。如果數據需要提交到服務器,則負責搜集數據的標簽必須存放在表單標簽中。

屬性:

(1)action屬性:請求路徑,確定表單提交到服務器的地址(路徑)。

(2)method屬性:請求方式,常用取值為get、Post。

get:默認值。

【𝗼𝗼𝗽.𝘁𝘄 無錯章節】

特點:提交的數據追加在請求路徑上。例如:/1.html?username=jack&password=1234,數據格式為key/value對,追加是使用“?”連接的,之後每一對數據之間都使用“&”連接。

因為請求路徑的長度有限,所以get方式提交的請求數據有限定。

因為要在地址欄中顯示數據,所以數據的安全性不高。

Post。

特點:提交的數據不在請求路徑上追加(即不顯示在地址欄中),數據的安全性更好,提交的數據無大小限定。

下麵介紹可以在form表單中出現的htmL元素(標簽)。

1.輸入域標簽input

標簽一般用於獲取用戶輸入信息,如果type屬性值不同,則標簽的展現形式和搜集的信息也不同,它是在頁麵中常用的標簽。

(1)type屬性。

text:單行文本框,用戶可以在其中輸入文本,默認寬度為20個字符。

password:密碼框,在該控件中輸入的內容不會明文顯示,以黑圓點顯示。

radio:單選按鈕,表示一組互斥選項按鈕中的一個。當一個按鈕被選中時,該組中之前選中的按鈕會變為非選中狀態。

submit:“提交”按鈕,該按鈕會把表單數據發送到服務器。一般不寫name屬性,否則會將“提交”兩個字提交到服務器。

因為不同項目注冊所需要的字段不同,需要完成的案例中沒有覆蓋所有表單元素,所以以下標簽的使用也需要掌握。

checkbox:複選框,用法與radio基本一致,在一組複選框中可以選擇任意多個選項。

file:文件上傳組件,提供“瀏覽”按鈕,可以選擇需要上傳的文件。

hidden:隱藏域,數據會發送給服務器,頁麵不進行顯示。

。態狀始初到複恢單表將,鈕按”置重“:teser

。片圖置設鈕按給crs過通,鈕按”交提“形圖:egami

。果效作動現實tpircsavaJ合結常通,鈕按通普:nottub

。據數的交提取獲值性屬該過通將器務服,值性屬eman供提須必則,器務服到交提據數單表將要需果如。名素元:性屬eman)2(

。字文示顯鈕按置設為來用eulav的鈕按teser和鈕按timbus。值認默的簽標tupni置設:性屬eulav)3(

。小大的素元:ezis)4(

。中選被框選複者或鈕按選單置設:dekcehc)5(

。入輸能不,讀隻素元置設:ylnodaer)6(

。用可不素元,後性屬該加添;用可否是:delbasid)7(

。度長大最的入輸許允:htgnelxam)8(

簽標框拉下.2

。下如性屬的簽標,中其。項表列個一每定指>noitpo<簽標子合結要需;選多者或選單行進以可,表列拉下現展:用作

ł。稱名數參的時器務服給送發據數將定確於用:eman)1(

。選多示表則,elpitlum為值取若;選單是認默則,性屬該寫不若:elpitlum)2(

。目數的項選見可,時選多:ezis)3(

。下如性屬,項選個一每的中表列拉下:>noitpo<簽標子)4(

l。項表列前當選勾:detceles

。值項選的端器務服給送發:eulav

簽標域本文.3

。下如性屬,息信本文的多意任入輸以可,框本文行多


✅ 付款功能已修復,現在可以正常購買了 — 支援信用卡 · Apple Pay · Google Pay · WebATM · ATM 轉帳
😤 廣告總在最入戲的時候跳出來?
月付 $5 USD,升級 VIP 後全站所有頁面廣告立即全關——
不是只有這本書,是整個 oop.tw 每一頁、每一章,從此一路讀到底不被打斷。 $5 USD ≈ 一杯珍奶的錢,換一整個月零廣告清爽閱讀 · 隨時可取消
✅ 全站廣告全關 ✅ 工口專區全本解鎖 ✅ 月卡 $5 USD · 季卡 $13 USD · 年卡 $45 USD
⭐ 登入 / 免費註冊後升級
加我 LINE 好友,分享好書不錯過
第一時間獲得新書推薦、書單更新通知
立即加入
上一頁 書頁/目錄
/ 11 頁
下一頁
為本書評分(每位讀者可評一次,提交後無法修改)
發表評論
以 匿名讀者 身份發表
讀者評論