其他對象的表單

1.textarea:
textarea對象就想是input對象中的text樣式的表單,只不過是擴展過的text樣式表單。它可以通過行(rows)屬性和列(cols)屬性來編輯文本域的大小。最常見于留言板、論壇時回帖時的文本框等。

<html><head><title>textarea對象的表單</title><style type="text/css">body{font:120% 微軟雅黑;}textarea{font:80% 微軟雅黑;color:navy;}</style></head><body>留言板<form action="..." method="post" enctype="multipart/form-data"><textarea name="some" rows="10" cols="50" value="say">請文明用語:                </textarea></form></body>
</html>

?

textarea屬性標簽是必須要封閉的,此外在<textarea>標簽中放入文本,如上面的“請文明用語”那么在生成頁面的時候,會預先設置好文本,它可以給用戶帶來親切的感受。但同時,用戶不得不先刪除預先的文本。(如果在文本框中輸入的內容超出預先設置的行數,會自動出現滾動條,如果沒有超出文本框的范圍,滾動條呈灰色。)

?

2.select對象的表單:
Select對象的表單將創建出一個列表樣式的表單,顯示為一個下拉列表,令用戶可以方便地選擇其中一個目錄。通常在一些要求填寫用戶地區、生日等信息時,設計者可以給使用者準備好選項,令使用者填寫信息時更方便。在代碼的寫法中,需要使用<option>標簽來定義可供選擇的每一項。

<body><form action="...">地址:<select name="上海"><option>黃浦區</option><option>虹口區</option><option>靜安區</option><option>長寧區</option><option>楊浦區</option><option>寶山區</option><option>浦東新區區</option><option>徐匯區</option><option>普陀區</option></select></form>

</body>

用戶可以通過下拉列表選擇一個“地址”,而這個數據則會被表單發送到服務器。還可以使用value屬性為每一個option指定不同的值,如果是這樣value設置的值將取代option的文本內容。
(如果設計者希望預先設置初始值,那么在所希望的option中添加select="selected"如,<option selected="selected">浦東新區</option>)

此外,如果下拉列表中的選項太多,可以使用<optgroup>標簽配合label屬性來給選項分類

<body><form action="...">地址:<select name="上海"><optgroup label="Team1"><option>黃浦區</option><option>虹口區</option><option>靜安區</option><option>長寧區</option></optgroup><optgroup label="Team2"><option>楊浦區</option><option>寶山區</option><option selected="selected">浦東新區區</option><option>徐匯區</option><option>普陀區</option></optgroup></select></form>
</body>

?

此外,如果設計者不希望select對象以下拉列表的形式展示出來,有一種方式可以將目錄項以滾動條的框體樣式表現出來。只需要在<select>標簽中加入size屬性,如size="6"則表示這是個能容納 6行文字的文本框。

?

不好看……)

?


表單域集合:
如果一個頁面中表單的項目過于繁多,設計者可以通過使用表單域將表單分組。當然,表單域未必是只有表單太長才適合用。事實上,很多時候,設計者以這樣的方式修飾表單部分。
表單域的代碼有<fieldset>標簽和<legend>標簽組合而成。默認情況下,<fieldset>標簽繪制出表單域的框型,<legend>標簽的對象像標題一樣出現在框型的左上角。

<body><form action="..." method="post"><fieldset><legend>注冊信息:</legend>輸入用戶名:<input name="name" type="text" size="20" maxlength="12"><!--這里可以放入許多樣式表的表單--></fieldset></form>
</body>

?

轉載于:https://www.cnblogs.com/wangshen31/p/7913065.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/281750.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/281750.shtml
英文地址,請注明出處:http://en.pswp.cn/news/281750.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

WinForm(十三)WebView2

WebView是WinForm框架中一個控件&#xff0c;用來對網頁信息交互&#xff0c;有時Web自己開發的&#xff0c;有時Web是三方的。下面通過一個例子來看看WebView2的使用。首先看Web的邏輯&#xff0c;是一個商品添加頁面&#xff0c;用AlpineJS和BootStrap來開發的&#xff0c;業…

Fluent UDF【4】:C語言

Fluent UDF利用的是C語言&#xff0c;本文簡單介紹在UDF中經常會用到的C語言常識。 本文部分內容來自UDF手冊。 1 C語言中的注釋 C語言中的注釋利用/*及*/來實現。例如: /*這是一個注釋*/ 注釋也可以跨行實現&#xff0c;如: /*這是一個 跨行注釋*/ 注意:在編寫UDF的過程中&…

java 畫磚塊,鋼筆畫入門:教你畫磚塊

說到磚塊很多朋友會想到搬磚&#xff0c;繪畫吧今天要教大家用鋼筆畫一塊磚&#xff0c;因為畫建筑的時候經常要畫磚墻&#xff0c;我們先從簡單的磚塊學起&#xff0c;之后繪畫吧會給大家分享畫一面磚墻的哦。繪制要點&#xff1a;本教程的主體物選擇了一塊有小殘缺面的磚頭。…

[轉] Node.js的線程和進程

[From] http://www.admin10000.com/document/4196.html 前言 很多Node.js初學者都會有這樣的疑惑&#xff0c;Node.js到底是單線程的還是多線程的&#xff1f;通過本章的學習&#xff0c;能夠讓讀者較為清晰的理解Node.js對于單/多線程的關系和支持情況。同時本章還將列舉一些讓…

第三方支付異步通知的陷阱

版權聲明&#xff1a;本文為博主原創文章&#xff0c;未經博主允許不得轉載。 https://blog.csdn.net/j16421881/article/details/78703792 用戶下單后調用第三方支付付款&#xff0c;然后接收第三方支付的異步通知&#xff0c;以便確認支付是否成功。 如下圖 但異步通知可能…

js請求php文件 302,采集某個 url, js 請求 200,瀏覽器訪問 302

/** 文件名: sso.js* 描述: 提供對 CAS 單點登錄的封裝** 功能說明&#xff1a;* 實現多個應用之間的單點登錄( SSO )功能&#xff0c;應用可以部署在不同的域名。容器的退出直接寫在頭里&#xff0c;避免 JS 過多加載** 版本: 1.0.0.1* 作者: [email protected]* 日期&#xf…

Jetty 類載入問題處理

前幾日使用 Jetty (9.2)部署公司一個 web 項目,這個項目原本部署在 Tomcat server上,一切正常,可是部署到 Jetty 后,啟動報錯.關鍵錯誤信息為"java.lang.NoClassDefFoundError: Could not initialize class org.apache.tomcat.jdbc.pool.DataSource" 項目使用了 Tomc…

2.3 萬 Star,Nginx 可視化配置工具

你好&#xff0c;這里是 Dotnet 工具箱&#xff0c;定期分享 Dotnet 有趣&#xff0c;實用的工具或組件&#xff0c;希望對您有用&#xff01;對于前后端開發工程師來說&#xff0c; Nginx 是必須掌握的工具&#xff0c;因為它不僅僅是一個 Web Server&#xff0c;還包含了其他…

城市智慧停車系統方案的產品設計體系介紹

最近幾年隨著大數據技術快速發展與應用&#xff0c;智慧城市隨即被正式提出。而且&#xff0c;我們也可以深刻感受到“智慧”正在慢慢改變我們的生活方式和城市。要讓城市變智慧的地方太多太多&#xff0c;當前我們接觸做多的可能就是外出停車&#xff0c;比如很多商場的停車系…

vue.js:利用vue.js做一個抽獎小游戲

MVVM模式是什么&#xff1a;MModel(模型)&#xff0c;VView&#xff08;視圖&#xff09;,VM ViewModel(簡寫成MVVM) . 代碼如下&#xff1a; 運行代碼結果&#xff1a; 1.你沒有中獎&#xff1a; 2.恭喜你&#xff0c;你中獎了&#xff1a; 轉載于:https://www.cnblogs.com/ya…

滾動加載數據 php,無刷新動態加載數據 滾動條加載適合評論等頁面

滾屏加載更多數據,適合評論等頁面本例的數據庫很簡單&#xff0c;一看就明了復制代碼 代碼如下:$querymysql_query("select * from content order by id desc limit 0,10");while ($rowmysql_fetch_array($query)) {?>js文件復制代碼 代碼如下:$(function(){var …

Java之品優購課程講義_day20(5)

資源過濾與變量替換 修改 pom.xml &#xff0c;在 build 節點中添加如下配置 <filters><filter>src/main/resources/filters/db_${env}.properties</filter></filters><resources><resource><directory>src/main/resources</dir…

國際主流固件接口組織UEFI全面支持LoongArch,龍架構已完成上游TianoCore EDK2代碼合并...

2022年9月初&#xff0c;UEFI官方組織在發布的UEFI specification V2.10規范中全面支持了LoongArch64架構以及部分LoongArch32架構。近期&#xff0c;龍芯團隊又完成了LoongArch基礎代碼與UEFI上游TianoCore EDK2的合并&#xff0c;LoongArch進入TianoCore EDK2主分支&#xff…

Invalidate和postInvalidate

為什么80%的碼農都做不了架構師&#xff1f;>>> Android提供了Invalidate方法實現界面刷新&#xff0c;但是Invalidate不能直接在線程中調用&#xff0c;因為他是違背了單線程模型&#xff1a;android UI操作并不是線程安全的&#xff0c;并且這些操作必須在UI線程…

java比c好逆向,吐槽一下java的效率。。。比起C差的真的好遠。。。

該樓層疑似違規已被系統折疊 隱藏此樓查看此樓刷計算機編程題目&#xff0c;USACO某道題&#xff0c;因為最近想用java&#xff0c;就寫了一個&#xff0c;各種查錯優化之后總算通過了&#xff1a;TASK: camelotLANG: JAVACompiling...Compile: OKExecuting...Test 1: TEST OK …

.Net輕松處理億級數據--clickhouse及可視化界面安裝介紹

前言我是在17年就聽說過Clickhouse,那時還未接觸過億數據的運算&#xff0c;那時我在的小公司對于千萬數據的解決方案還停留在分庫分表&#xff0c;最好的也是使用mycat做的集群。這些解決方案都比較復雜&#xff0c;畢竟通常來說那些需要大量存儲的數據基本都是像日志&#xf…

[USACO 4.2] 完美的牛欄

★★☆ 輸入文件&#xff1a;stall4.in 輸出文件&#xff1a;stall4.out 簡單對比 時間限制&#xff1a;1 s 內存限制&#xff1a;128 MB USACO/stall4(譯by Felicia Crazy)描述 農夫約翰上個星期剛剛建好了他的新牛棚&#xff0c;他使用了最新的擠奶技術。不幸的是&am…

003Java語言環境搭建

JRE,JDK JRE(Java Runtime Environment java運行環境)&#xff1a;包括java虛擬機和java程序所需要的核心類庫&#xff0c; 如果要運行一個開發好的java程序&#xff0c;計算機中只需要安裝一個JRE JDK&#xff08;Java Development Kit Java開發工具包&#xff09; JDK是提供給…

php 編寫mysql,自己寫的MySQL類

自己寫的MySQL類---------- php debug ----------Serverlocalhost;DataBasemysql;UserIDroot;PassWord123456resource(5) of type (mysql result)Output completed (1 sec consumed) - Normal Terminationclass DBCLS{//debug 調試開關var $debug true;//debuginfo 錯誤信息&a…

NET CORE讀取Excel.xlsx單元格內的圖片,并關聯當前業務ID推送圖片到指定服務器...

NET CORE讀取Excel.xlsx單元格圖片的場景&#xff0c;一般是批量導入業務數據&#xff0c;例如&#xff1a;藥品的圖片&#xff0c;醫師資格證&#xff0c;商品上架、商家營業資質、水果信息、用戶頭像等等這里我截個圖&#xff0c;圖文并茂更好理解特別聲明&#xff1a;粘貼圖…