訂閱本欄目 RSS您所在的位置: 深山工作室 > DIV+CSS > 正文

CSS設計符合Web標準的網頁表單的幾個技巧

網頁教學網 2008/3/19 19:58:10 深山行者 字體: 瀏覽 6951

本文總結了用div css進行網頁表單布局的五個小技巧可以幫助你更靈活的控制表單,使頁面更加滿意。

1、表單文本輸入的移動選擇:

在文本輸入欄中,如果加入了提示,來訪者往往要用鼠標選取后刪除,再輸入有用的信息。其實只要加入onMouseOver="this.focus()" onFocus="this.select()" 代碼到 <textarea> 中,一切就會變得簡單多了,如:

以下是引用片段:


<textarea name=textarea wrap=virtual rows=2 cols=22 onMouseOver="this.focus()" onFocus="this.select()">Input English..</textarea>

類似的,可以加入代碼到<input>。

2、表單輸入單元點擊刪除:

本列同上則作用類似,只是使用鼠標上略有變化,需要點擊而不像上則的只要鼠標覆蓋。如:

以下是引用片段:

<input type=text name="address" size=19 value="Enter,e-mail..."onFocus="this.value=''">

點擊輸入單元后,提示信息會刪除,是不是很方便。

3、表單輸入單元的邊框設置:

更改傳統的表單單元邊框,會讓你的主頁生色不少。如:

以下是引用片段:

<input type=radio name=action value=subscribe checked style="BORDER-BOTTOM: dashed 1px; BORDER-LEFT: dashed 1px; BORDER-RIGHT: dashed 1px; BORDER-TOP: dashed 1px;background-color: #FEF5C8">

其中"style=***"為左右上下和背景色設置,適用于其它單元,請讀者親自試試。

4、表單輸入單元的文字設置:

表單中單元的字體是可以修改的,如

 

以下是引用片段:

:<input type=text name="address" size=19 value="Enter,e-mail..." style=font-family:"verdana";font-size:10px >

  其中"style=***"為字體和字大小設置。

5、修改表單屬性為彈出窗口:

大多數表單激活后,會在當前頁面中打開,影響正常瀏覽。不如修改一下,如:

以下是引用片段:

<form method=POST action=url target=_blank>

 

其中"target=_blank"為控制在彈出窗口打開。

相關閱讀
當鼠標經過表單,表單承現選擇狀效果
深山旅行社網站管理系統5.0發布
Javascript JS 限制復選框的選擇個數(3)
河南中旅旅行社
網頁制作,改變你的思維方
ASP+Access隨機讀取數據庫記錄的方法
支持win7的node.js版本
膠球清洗裝置
共有0條關于《CSS設計符合Web標準的網頁表單的幾個技巧》的評論
發表評論
正在加載評論......
返回頂部發表評論
呢 稱:
表 情:
內 容:
評論內容:不能超過 1000 字,需審核,請自覺遵守互聯網相關政策法規。
驗證碼: 驗證碼 
網友評論聲明,請自覺遵守互聯網相關政策法規。

您發布的評論即表示同意遵守以下條款:
一、不得利用本站危害國家安全、泄露國家秘密,不得侵犯國家、社會、集體和公民的合法權益;
二、不得發布國家法律、法規明令禁止的內容;互相尊重,對自己在本站的言論和行為負責;
三、本站對您所發布內容擁有處置權。

更多信息>>欄目類別選擇
百度小程序開發
微信小程序開發
微信公眾號開發
uni-app
asp函數庫
ASP
DIV+CSS
HTML
python
更多>>同類信息
jquery設置或獲取修改classname
利用css3.0寫出一個音樂播放的唱片碟盤的效果
利用css中的scale()實現放大縮小效果
利用background-color:#000000a8在背景顏色16進制代碼之后加字母加上數字讓背景色透明
css背景使用base64編碼或者將base64編碼放在img圖片標簽中
利用css3中的-webkit-font-smoothing把網頁文字的毛邊去掉
更多>>最新添加文章
在Android、iOS、Windows、MacOS中微信小程序的文件存放路徑
python通過代碼修改pip下載源讓下載庫飛起
python里面requests.post返回的res.text還有其它的嗎
aliyun阿里云續費域名優惠口令(注冊、續費都可以使用)
windows7環境下安裝配置jdk
python對微信操作要用到這兩個庫wxpy與itchat
ASP中Utf-8與Gb2312編碼轉換亂碼問題的解決方法頁面編碼聲明
DW設置之后更好用 DreamweaverCS編輯GB2312與UTF-8文件在代碼視圖中點擊鼠標錯位問題的解決辦法
更多>>隨機抽取信息
Javascript腳本常用代碼
長春海外旅行社
深山網吧留言板系統v4.0
深山旅行社網站管理系統 v1.8
黑色的非??岬暮唵蜫avaScript日歷及說明
網頁制作中關于瀏覽器寬度和高度的設定研究(轉載)
日韩gv国产gv欧美旡码|伊人久久大香线AV五月天|亚洲精品无码永久在线|亚洲第一页自拍1414