網(wǎng)頁設(shè)計(jì)中文本輸入框的一些參數(shù)說明_XHTML教程
在一般的留言本,論壇等地方都要用到文本輸入框,也就是html語言中的textarea,textare包含有眾多的參數(shù),學(xué)會(huì)運(yùn)用這些參數(shù),就可以隨意修改文本輸入框的大小和外觀,達(dá)到你想要的效果,下面就來介紹這些參數(shù),以及如何使用這些參數(shù)。
1、cols,垂直列。在沒有做樣式表設(shè)置的情況下,它表示一行中可容納下的字節(jié)數(shù)。例如cols=60,表示一行中最多可容納60個(gè)字節(jié),也就是30個(gè)漢字。另外要注重的是,文本框的寬度就是通過這個(gè)來調(diào)整,輸入好cols的數(shù)值,然后再定義輸入文字字體的大小(不定義的話,會(huì)采用默認(rèn)值),那么文本框的寬度就確定了。
2、rows,水平列。表示可顯示的行數(shù),例如rows=10,表示可顯示10行。超過10行,則需要拖動(dòng)滾動(dòng)條來瀏覽了。(同上,文本框的高度就是通過這個(gè)來控制的。)
3、name,文本框的名稱,這項(xiàng)必不可省,因?yàn)榇鎯?chǔ)文本的時(shí)候必須用到。
4、warp,當(dāng)warp="off"表示該文本區(qū)域中不自動(dòng)換行,當(dāng)然不寫默認(rèn)是自動(dòng)換行的。這個(gè)參數(shù)一般用得比較少。
5、style,這是個(gè)非常實(shí)用的參數(shù),可以用來設(shè)置文本框的背景色,滾動(dòng)條顏色及形式,邊框色,輸入字體的大小顏色等等。
6、class,一般用來調(diào)用外部css里邊的設(shè)置。
例1:設(shè)置文本框的行數(shù)為40,列數(shù)為10。名稱為text。表達(dá)形式 <textarea cols=40 rows=10 name=text></textarea>
例2:取消文本框右邊的滾動(dòng)條。表達(dá)形式<textarea cols=40 rows=10 name=text style="overflow:auto"></textarea>。style="overflow:auto"的意思就是當(dāng)輸入的文本超出設(shè)置的行數(shù)時(shí)才自動(dòng)顯示滾動(dòng)條。
例3:設(shè)置文本框的背景色。<textarea cols=40 rows=10 name=text style="background-color:BFCEDC"></textarea>。
例4:另外設(shè)置文本框的滾動(dòng)條顏色,邊框色,以及字體大小,顏色,行距等,都可以直接在style里設(shè)置。不過這些一般都習(xí)慣在CSS里設(shè)置,直接調(diào)用就好了。下面是一段CSS設(shè)置代碼:應(yīng)該比較輕易看懂,textbox里邊依次設(shè)置的是文本框的背景色,上下左右邊框色和厚度,以及輸入字體的大小等。
| <style> .textbox { BACKGROUND: #BFCEDC; BORDER-TOP: #7F9DB9 1px solid; BORDER-LEFT: #7F9DB9 1px solid; BORDER-RIGHT: #7F9DB9 1px solid; BORDER-BOTTOM: #7F9DB9 1px solid; FONT-FAMILY: "宋體", "Verdana", "Arial", "Helvetica"; FONT-SIZE: 12px; TEXT-ALIGN: LIFT;} </style> |
把上面一段代碼插到頁面的<head>與</head>之間。調(diào)用方式:<textarea cols=40 rows=10 name=text class="textbox"></textarea>。 class=""中的名字對(duì)應(yīng)css里邊要用到的設(shè)置的名字。熟悉了這些參數(shù),修改和美化文本輸入框就很方便了。
- HTML5 INPUT placeholder及兼容性處理
- HTML表單里的Label標(biāo)簽
- 淺析HTML與javascript中常用編碼
- CSS網(wǎng)頁布局中必須要了解的幾個(gè)XHTML標(biāo)簽
- title和alt 標(biāo)簽介紹及其異同
- 淺析HTML標(biāo)簽strong和em的區(qū)別
- 說說XHTML中的alt屬性和title屬性
- Semantics語義是Html Xhtml是否真正符合標(biāo)準(zhǔn)的重要部分
- 九個(gè)W3C XHTML1.0及CSS標(biāo)準(zhǔn)認(rèn)證需要注意的問題
- 請(qǐng)注意頁面head區(qū)域的編碼是不是規(guī)范
- HTML validate - 驗(yàn)證HTML代碼穿越多重瀏覽器標(biāo)準(zhǔn)
- XHTML具有語義的標(biāo)簽:有關(guān)H1位置的討論
XHTML教程Rss訂閱Div+Css教程搜索
XHTML教程推薦
- XHTML入門學(xué)習(xí)教程:XHTML超級(jí)鏈接
- HTML表格標(biāo)記教程(26):單元格標(biāo)記
- HTML表格標(biāo)記教程(16):標(biāo)題水平對(duì)齊屬性ALIGN
- HTML表格標(biāo)記教程(41):表頭的寬度和高度屬性WIDTH、HEIGHT
- XHTMLDHTMLSHTML到底是什么,有何區(qū)別?
- XHTML入門學(xué)習(xí)教程:文字格式與特殊字符
- 添加和刪除HTML節(jié)點(diǎn)的簡(jiǎn)單示例
- 網(wǎng)頁設(shè)計(jì)之網(wǎng)頁音樂的實(shí)現(xiàn)技巧
- HTML頁面中標(biāo)簽的語義與使用位置
- 總結(jié)XHTML代碼常見的應(yīng)用問題
- 相關(guān)鏈接:
- 教程說明:
XHTML教程-網(wǎng)頁設(shè)計(jì)中文本輸入框的一些參數(shù)說明
。