這篇文章主要講解了“HTML怎么開(kāi)發(fā)單選題頁(yè)面”，文中的講解內(nèi)容簡(jiǎn)單清晰，易于學(xué)習(xí)與理解，下面請(qǐng)大家跟著小編的思路慢慢深入，一起來(lái)研究和學(xué)習(xí)“HTML怎么開(kāi)發(fā)單選題頁(yè)面”吧！

站在用戶的角度思考問(wèn)題，與客戶深入溝通，找到海城網(wǎng)站設(shè)計(jì)與海城網(wǎng)站推廣的解決方案，憑借多年的經(jīng)驗(yàn)，讓設(shè)計(jì)與互聯(lián)網(wǎng)技術(shù)結(jié)合，創(chuàng)造個(gè)性化、用戶體驗(yàn)好的作品，建站類型包括：網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣、主機(jī)域名、網(wǎng)絡(luò)空間、企業(yè)郵箱。業(yè)務(wù)覆蓋海城地區(qū)。

表格

table標(biāo)簽(表格)、

tr標(biāo)簽(行)、

td標(biāo)簽(標(biāo)準(zhǔn)單元格)、

caption標(biāo)簽(標(biāo)題)、

th標(biāo)簽(表頭單元格)。

為了更深一層對(duì)表格進(jìn)行語(yǔ)義化，HTML引入了thead、tbody和tfoot這三個(gè)標(biāo)簽。

這三個(gè)標(biāo)簽把表格分為三部分：表頭、表身、表腳。

table 表格

caption 標(biāo)題

thead 表頭(語(yǔ)義劃分)

tbody 表身(語(yǔ)義劃分)

tfoot 表尾(語(yǔ)義劃分)

tr 行

th 表頭單元格

td 表格單元格

姓名語(yǔ)文英語(yǔ)數(shù)學(xué)

小明808080小紅909090小杰100100100平均909090

表格樣式美化

table, th, td {

border: 1px solid black;

border-collapse: collapse;

}

th, td {

padding: 6px;

color: blue;

}

給表格添加邊框，設(shè)置字體顏色，

以及給單元格設(shè)置一些padding

表單

表單就是收集用戶信息的，就是讓用戶填寫(xiě)的、選擇的。

所有的表單內(nèi)容，都要寫(xiě)在form標(biāo)簽里面

form是英語(yǔ)表單的意思，form中間可以添加文本框、密碼框、單選按鈕、復(fù)選框、下拉列表、按鈕、文本域等內(nèi)容

1.文本框

2.密碼框

3.單選按鈕男 女

input的type的值如果是radio就是單選按鈕。

需要注意的是必須要有相同的name屬性，單選按鈕才能互斥。

label標(biāo)簽

男

女

input元素要有一個(gè)id，然后label標(biāo)簽就有一個(gè)for屬性，和id相同，就表示綁定了，這個(gè)label和input就有綁定關(guān)系了。點(diǎn)擊label標(biāo)簽中的文字就可以選擇相應(yīng)的單選框

5.4.復(fù)選框 睡覺(jué)

吃飯

復(fù)選框，最好也是有相同的name(便于服務(wù)器端收集用戶選中的信息)。

5.下拉列表

吃飯

睡覺(jué)

打豆豆

select就是“選擇”，

select標(biāo)簽和ul、ol、dl一樣，都是組標(biāo)簽

option“選項(xiàng)”。

6.文本域

cols屬性表示columns“列”，

rows屬性表示rows“行”。

值就是數(shù)字，表示行數(shù)和列數(shù)。標(biāo)簽對(duì)兒中間的文字是默認(rèn)出現(xiàn)在文本框的文字，一般不需要寫(xiě)字。

7.按鈕

普通按鈕

button就是英語(yǔ)“按鈕”的意思。value的“值”就是按鈕上面顯示的文字。

提交按鈕

submit就是英語(yǔ)“提交”的意思。這個(gè)按鈕不需要寫(xiě)value自動(dòng)就有“提交”文字。這個(gè)按鈕點(diǎn)擊，表單會(huì)提交到服務(wù)器。

重置按鈕

reset就是“復(fù)位”“重置”的意思，可以重置前面各個(gè)表單元素中填寫(xiě)的值。

只讀和禁用

項(xiàng)目實(shí)戰(zhàn)

制作商品搜索表單

search-form.css.search{

height: 40px;

width: 420px;

margin: 0 auto;

margin-top: 60px;

}

.search .input{

border: 3px solid red;

width: 300px;

height: 36px;

font-size: 20px;

}

.search .btn{

height: 44px;

width: 100px;

border:0;

background-color: red;

color: white;

font-size: 18px;

font-weight: bold;

margin-left: -4px;

vertical-align: top;

letter-spacing: 6px;

}

youlu-search-form.html

Document

感謝各位的閱讀，以上就是“HTML怎么開(kāi)發(fā)單選題頁(yè)面”的內(nèi)容了，經(jīng)過(guò)本文的學(xué)習(xí)后，相信大家對(duì)HTML怎么開(kāi)發(fā)單選題頁(yè)面這一問(wèn)題有了更深刻的體會(huì)，具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián)，小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章，歡迎關(guān)注！