HTML学习04之内联框架和表单
生活随笔
收集整理的這篇文章主要介紹了
HTML学习04之内联框架和表单
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
內(nèi)聯(lián)框架
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>內(nèi)聯(lián)框架學(xué)習(xí)</title><!--iframe+tab--> </head> <body><!--iframe內(nèi)聯(lián)框架 src:地址 w-h:寬度和高度 --> <iframe src="https://www.baidu.com" name="hello" frameborder="0" width="800" height="500" ></iframe><a href="1.我的第一個(gè)網(wǎng)頁(yè).html" target="hello">跳轉(zhuǎn)</a> </body> </html>
這里百度屏蔽了我們的請(qǐng)求,不要在意!
表單
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>表單學(xué)習(xí)</title><!--登錄注冊(cè)--> </head> <body><h1>注冊(cè)</h1><!--表單form action:表單提交的位置,可以是網(wǎng)站,也可以是一個(gè)請(qǐng)求處理的地址 method:post,get提交方式 get方式提交:我們可以在url中看到我們提交的信息,不安全,高效 post提交:比較安全,傳輸大文件 表單應(yīng)用 readonly 只讀 hidden 隱藏域 disable 禁用 表單初級(jí)驗(yàn)證 placeholder 提示信息 required 非空判斷 pattern 正則表達(dá)式https://deerchao.cn/tutorials/regex/common.htm --> <form action="1.我的第一個(gè)網(wǎng)頁(yè).html" method="get"><!--文本輸入框:input type="text"value="狂神好帥" 默認(rèn)初始值maxlength="8" 最長(zhǎng)能寫幾個(gè)字符size="16" 文本框的長(zhǎng)度--><p>賬號(hào):<input type="text" name="username" placeholder="請(qǐng)輸入用戶名"></p><!--密碼輸入框:input type="password" --><p>密碼:<input type="password" name="pw" placeholder="請(qǐng)輸入密碼"></p><!--單選框標(biāo)簽 radioinput type="radio"value:單選框的值name:表示組--><p>性別:<input type="radio" value="boy" name="sex">男<input type="radio" value="girl" name="sex">女</p><!--多選框 input type="checkbox"checked 默認(rèn)選中--><p>愛(ài)好:<input type="checkbox" value="sleep" name="hobby">睡覺(jué)<input type="checkbox" value="code" name="hobby" checked>敲代碼<input type="checkbox" value="chat" name="hobby">聊天<input type="checkbox" value="girlfriend" name="hobby">女朋友<input type="checkbox" value="game" name="hobby">游戲</p><!--按鈕input type="button" 普通按鈕input type="image" 圖像按鈕input type="submit" 提交input type="reset" 重置--><p>按鈕:<input type="button" name="bt1" value="點(diǎn)擊變長(zhǎng)"><input type="image" src="../resources/image/洛克王國(guó).png"><a href="https://www.4399.com/flash/32979.htm" target="_blank" title="洛克王國(guó)"><img src="../resources/image/洛克王國(guó).png" alt="洛克王國(guó)圖片" ></a></p><!--下拉框,列表框--><p>國(guó)家:<select name="列表名稱"><option value="us">美國(guó)</option><option value="china" selected>中國(guó)</option><option value="eth">瑞士</option><option value="jp">日本</option></select></p><!--文本域行:cols="30"列:rows="10"--><p>反饋:<textarea name="textarea" id="" cols="30" rows="10"></textarea></p><!--文件域 input type="file"--><p><input type="file" name="files"><input type="button" value="上傳" name="upload"></p><!--郵件驗(yàn)證--><p>郵箱:<input type="email" name="email"></p><!--url驗(yàn)證--><p>URL:<input type="url" name="url"></p><!--數(shù)字驗(yàn)證--><p>商品數(shù)量:<input type="number" name="num" min="0" max="100" step="1"></p><!--滑塊--><p>音量:<input type="range" name="voice" min="0" max="100" step="1"></p><!--搜索框--><p>搜索:<input type="search" name="search" disabled></p><!--提升鼠標(biāo)可用性--><label for="mark">分?jǐn)?shù):</label><input type="number" id="mark" value="98" max="100" min="0"><!--提交,重置--><p><input type="submit"><input type="reset"></p> </form> </body> </html>部分截圖
表單應(yīng)用
作者有話說(shuō)
博客創(chuàng)作不易,希望看到這里的讀者,動(dòng)動(dòng)你的小手點(diǎn)個(gè)贊,如果喜歡的小伙伴可以一鍵三連,作者大大在這里給大家謝謝了。
總結(jié)
以上是生活随笔為你收集整理的HTML学习04之内联框架和表单的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: HTML学习03之列表,表格,媒体元素
- 下一篇: SpringMVC学习03之使用注解开发