-
HTML~
HTML
HTML是一门语言，所有的网页都是用HTML这门语言编写出来的HTML(HyperText Markup Language):超文本标记语言
超文本:超越了文本的限制，比普通文本更强大。除了文字信息，还可以定义图片、音频、视频等内容
标记语言:由标签构成的语言
HTML运行在浏览器上，HTML标签由浏览器来解析
HTML标签都是预定义好的。例如:使用
展示图片
W3C标准:网页主要由三部分组成
结构:HTML
表现:CSS
行为:JavaScript
1，HTML入门
1．新建文本文件，后缀名改为.html
2．编写HTML结构标签
3．在
中定义文字- <html>
- <head>
- <title>html 快速入门title>
- head>
- <body>
- <font color="red">乾坤未定，你我皆是黑马~font>
- body>
- html>
HTML结构标签:
标签 描述 定义HTML文档 定义关于文档的信息 </td><td>定义文档的标题</td></tr><tr><td><body></td><td>定义文档的主题</td></tr></tbody></table></div> <p><span style="color:#fe2c24;">HTML标签不区分大小写</span></p> <p><span style="color:#fe2c24;">HTML标签属性值单双引皆可</span></p> <p><span style="color:#fe2c24;">HTML语法松散</span></p> <h2><a name="t1"></a> 2，基础标签</h2> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>标签</td><td>描述</td></tr><tr><td><h1> ~ <h6></td><td>定义标题，h1最大，h6最小</td></tr><tr><td><font></td><td>定义文本的字体、字体尺寸、字体颜色</td></tr><tr><td><b></td><td>定义粗体文本</td></tr><tr><td><i></td><td>定义斜体文本</td></tr><tr><td><u></td><td>定义文本下划线</td></tr><tr><td><center></td><td>定义文本居中</td></tr><tr><td><p></td><td>定义段落</td></tr><tr><td><br></td><td>定义折行</td></tr><tr><td><hr></td><td>定义水平线</td></tr></tbody></table></div> <pre data-index="1" class="set-code-show" name="code"><span style="color:#fe2c24;">html表示颜色: 1．英文单词: red , pink , blue . . . 2. rgb(值1,值2,值3):值的取值范围:0~255 rgb(255,0,0) 3．#值1值2值3:值的范围:00~FF</span></pre> <p> 转义字符:</p> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>HTML源代码</td><td>显示结果</td><td>描述</td></tr><tr><td><</td><td><</td><td>小于号或显示标记</td></tr><tr><td>></td><td>></td><td>大于号或显示标记</td></tr><tr><td>&</td><td>&</td><td>可用于显示其它特殊字符</td></tr><tr><td>"</td><td>"</td><td>引号</td></tr><tr><td>®</td><td>®</td><td>已注册</td></tr><tr><td>©</td><td>© </td><td>版权</td></tr><tr><td>™</td><td> ™</td><td>商标</td></tr><tr><td> </td><td></td><td>不断行的空白</td></tr></tbody></table></div> <h2><a name="t2"></a>3，图片，音频，视频标签</h2> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>标签</td><td>描述</td></tr><tr><td><img></td><td>定义图片</td></tr><tr><td><audio></td><td>定义音频</td></tr><tr><td><video></td><td>定义视频</td></tr></tbody></table></div> <p><span style="color:#fe2c24;">img:定义图片</span></p> <p> src:规定显示图像的URL(统一资源定位符)</p> <p> height:定义图像的高度</p> <p> width:定义图像的宽度</p> <p><span style="color:#fe2c24;">audio:定义音频。支持的音频格式:MP3、WAV、OGG</span></p> <p> src:规定音频的URL</p> <p> controls:显示播放控件</p> <p><span style="color:#fe2c24;">video:定义视频。支持的音频格式:MP4, WebM、OGG</span></p> <p> src:规定视频的URL</p> <p> controls:显示播放控件</p> <p style="text-align:center;"><img alt="" src="https://1000bd.com/contentImg/2024/03/06/030206632.png"></p> <p>尺寸单位:px和%</p> <p> 资源路径:</p> <p> 1.绝对路径:完整路径</p> <p> 2.相对路径:相对位置关系</p> <h2><a name="t3"></a>4，超链接标签</h2> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>标签</td><td>描述</td></tr><tr><td><a></td><td>定义超链接，用于链接到另一个资源</td></tr></tbody></table></div> <p>href:指定访问资源的URL</p> <p>target:指定打开资源的方式</p> <p> _self:默认值，在当前页面打开</p> <p> _blank:在空白页面打开</p> <pre data-index="2" class="set-code-show" name="code"><code class="language-html hljs language-xml"><span class="hljs-tag"><<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"http://www.itcast.cn"</span> <span class="hljs-attr">target</span>=<span class="hljs-string">"_blank"</span>></span>点我有惊喜<span class="hljs-tag"></<span class="hljs-name">a</span>></span></code><div class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)"></div></pre> <h2><a name="t4"></a>5，列表标签</h2> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>标签</td><td>描述</td></tr><tr><td><ol></td><td>定义有序列表</td></tr><tr><td><ul></td><td>定义无序列表</td></tr><tr><td><li></td><td>定义列表项</td></tr></tbody></table></div> <p>type:设置项目符号</p> <pre data-index="3" class="set-code-show" name="code"><code class="language-html hljs language-xml"><ol class="hljs-ln" style="width:100%"><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="1"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">ol</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="2"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">li</span>></span>咖啡<span class="hljs-tag"></<span class="hljs-name">li</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="3"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">li</span>></span>牛奶<span class="hljs-tag"></<span class="hljs-name">li</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="4"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">li</span>></span>茶<span class="hljs-tag"></<span class="hljs-name">li</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="5"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">ol</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="6"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="7"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">ul</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="8"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">li</span>></span>咖啡<span class="hljs-tag"></<span class="hljs-name">li</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="9"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">li</span>></span>牛奶<span class="hljs-tag"></<span class="hljs-name">li</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="10"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">li</span>></span>茶<span class="hljs-tag"></<span class="hljs-name">li</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="11"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">ul</span>></span></div></div></li></ol></code><div class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)"></div></pre> <h2><a name="t5"></a>6，表格标签</h2> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>标签</td><td>描述</td></tr><tr><td><table></td><td>定义表格</td></tr><tr><td><tr></td><td>定义行</td></tr><tr><td><td></td><td>定义单元格</td></tr><tr><td><th></td><td>定义表头单元格</td></tr></tbody></table></div> <p><span style="color:#fe2c24;">table:定义表格</span></p> <p> border:规定表格边框的宽度</p> <p> width :规定表格的宽度</p> <p> cellspacing:规定单元格之间的空白</p> <p><span style="color:#fe2c24;">tr:定义行</span></p> <p> align:定义表格行的内容对齐方式</p> <p><span style="color:#fe2c24;">td:定义单元格</span></p> <p> rowspan:规定单元格可横跨的行数</p> <p> colspan:规定单元格可横跨的列数</p> <pre data-index="4" class="set-code-hide" name="code"><code class="language-html hljs language-xml"><ol class="hljs-ln" style="width:100%"><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="1"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">table</span> <span class="hljs-attr">border</span>=<span class="hljs-string">"1"</span> <span class="hljs-attr">cellspacing</span>=<span class="hljs-string">"0"</span> <span class="hljs-attr">width</span>=<span class="hljs-string">"500"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="2"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">tr</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="3"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">th</span>></span>序号<span class="hljs-tag"></<span class="hljs-name">th</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="4"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">th</span>></span>品牌<span class="hljs-tag"></<span class="hljs-name">th</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="5"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">th</span>></span>品牌名称<span class="hljs-tag"></<span class="hljs-name">th</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="6"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">th</span>></span>企业名称<span class="hljs-tag"></<span class="hljs-name">th</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="7"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">tr</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="8"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">tr</span> <span class="hljs-attr">align</span>=<span class="hljs-string">"center"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="9"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>010<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="10"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>a<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="11"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>三只松鼠<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="12"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>三只松鼠<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="13"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">tr</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="14"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">tr</span> <span class="hljs-attr">align</span>=<span class="hljs-string">"center"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="15"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>009<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="16"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>b<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="17"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>优衣库<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="18"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>优衣库<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="19"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">tr</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="20"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">tr</span> <span class="hljs-attr">align</span>=<span class="hljs-string">"center"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="21"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>008<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="22"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>c<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="23"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>小米<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="24"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">td</span>></span>小米科技有限公司<span class="hljs-tag"></<span class="hljs-name">td</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="25"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">tr</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="26"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">table</span>></span></div></div></li></ol></code><div class="hide-preCode-box"><span class="hide-preCode-bt" data-report-view="{"spm":"1001.2101.3001.7365"}"><img class="look-more-preCode contentImg-no-view" src="https://1000bd.com/contentImg/2022/06/27/191644837.png" alt="" title=""></span></div><div class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)"></div></pre> <p style="text-align:center;"><img alt="" src="https://img-blog.csdnimg.cn/direct/22ed6262f24b4382b1ca89fa59491c3d.png"></p> <h2><a name="t6"></a> 7，布局标签</h2> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>标签</td><td>描述</td></tr><tr><td><div></td><td>定义HTML文档中的一个区域部分，经常与cSS一起使用，用来布局网页</td></tr><tr><td><span></td><td>用于组合行内元素</td></tr></tbody></table></div> <h2 style="background-color:transparent;"><a name="t7"></a>8，表单标签</h2> <p>表单:在网页中主要负责数据采集功能，使用<form>标签定义表单</p> <p>表单项(元素):不同类型的input元素、下拉列表、文本域等</p> <h3><a name="t8"></a>（1）表单</h3> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>标签</td><td>描述</td></tr><tr><td><form></td><td>定义表单</td></tr><tr><td><input></td><td>定义表单项，通过type属性控制输入形式</td></tr><tr><td><label></td><td>为表单项定义标注</td></tr><tr><td><select></td><td>定义下拉列表</td></tr><tr><td><option></td><td>定义下拉列表的列表项</td></tr><tr><td><textarea></td><td>定义文本域</td></tr></tbody></table></div> <p>（1）form:定义表单</p> <p>1）action:规定当提交表单时向何处发送表单数据，URL</p> <p> #表单项数据要想被提交，则必须指定其name属性</p> <p>3）method :规定用于发送表单数据的方式</p> <p>【1】get:浏览器会将数据直接附在表单的action URI之后。大小有限制</p> <p> 请求参数会拼接在url后面</p> <p> url长度有限制 4KB</p> <p>【2】post:浏览器会将数据放到http请求消息体中。大小无限制</p> <p> 请求参数会在http请求协议的请求体中</p> <h3><a name="t9"></a>（2）表单项</h3> <p><input>:表单项，通过type属性控制输入形式</p> <p><select>:定义下拉列表，<option>定义列表项</p> <p style="text-align:center;"><img alt="" height="79" src="https://1000bd.com/contentImg/2024/03/06/030206506.png" ></p> <p><textarea>︰文本域</p> <p style="text-align:center;"><img alt="" height="37" src="https://1000bd.com/contentImg/2024/03/06/030206450.png" ></p> <div class="table-box"><table border="1" cellpadding="1" cellspacing="1" style="width:500px;"><tbody><tr><td>type取值</td><td>描述</td></tr><tr><td>text</td><td style="text-align:center;">默认值，定义单行的输入字段<img alt="" height="21" src="https://1000bd.com/contentImg/2024/03/06/030206574.png" ></td></tr><tr><td>password</td><td style="text-align:center;">定义密码字段 <img alt="" height="19" src="https://img-blog.csdnimg.cn/direct/9d0de592be33438f9629e7369ffc50d4.png" width="127"></td></tr><tr><td>radio</td><td style="text-align:center;">定义单选按钮 <img alt="" height="20" src="https://1000bd.com/contentImg/2024/03/06/030206627.png" ></td></tr><tr><td>checkbox</td><td style="text-align:center;">定义复选框 <img alt="" height="24" src="https://1000bd.com/contentImg/2024/03/06/030206469.png" ></td></tr><tr><td>file</td><td style="text-align:center;">定义文件上传按钮 <img alt="" height="27" src="https://img-blog.csdnimg.cn/direct/8441f49c0f46457da677e17d81cebf3d.png" width="108"></td></tr><tr><td>hidden</td><td>定义隐藏的输入字段</td></tr><tr><td>submit</td><td style="text-align:center;">定义提交按钮，提交按钮会把表单数据发送到服务器<img alt="" height="23" src="https://img-blog.csdnimg.cn/direct/3745fe6fb7714f429e8a6983ef700332.png" width="55"></td></tr><tr><td>reset</td><td style="text-align:center;">定义重置按钮，重置按钮会清除表单中的所有数据<img alt="" height="21" src="https://1000bd.com/contentImg/2024/03/06/030206431.png" ></td></tr><tr><td>button</td><td style="text-align:center;">定义可点击按钮 <img alt="" height="22" src="https://1000bd.com/contentImg/2024/03/06/030206557.png" ></td></tr></tbody></table></div> <pre data-index="5" class="set-code-hide" name="code"><code class="language-html hljs language-xml"><ol class="hljs-ln" style="width:818px"><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="1"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">form</span> <span class="hljs-attr">action</span>=<span class="hljs-string">"#"</span> <span class="hljs-attr">method</span>=<span class="hljs-string">"post"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="2"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="3"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"hidden"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"id"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"123"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="4"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="5"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"username"</span>></span>用户名:<span class="hljs-tag"></<span class="hljs-name">label</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="6"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"text"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"username"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"username"</span>></span><span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="7"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="8"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"password"</span>></span>密码:<span class="hljs-tag"></<span class="hljs-name">label</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="9"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> 密码:<span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"text"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"password"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"password"</span>></span><span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="10"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="11"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> 性别:</div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="12"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"radio"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"gender"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"1"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"male"</span>></span> <span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"male"</span>></span>男<span class="hljs-tag"></<span class="hljs-name">label</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="13"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"radio"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"gender"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"2"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"female"</span>></span> <span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"female"</span>></span>女<span class="hljs-tag"></<span class="hljs-name">label</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="14"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="15"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="16"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> 爱好:</div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="17"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"checkbox"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"hobby"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"1"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"trip"</span>></span> <span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"trip"</span>></span>旅游<span class="hljs-tag"></<span class="hljs-name">label</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="18"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"checkbox"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"hobby"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"2"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"movie"</span>></span> <span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"movie"</span>></span>电影<span class="hljs-tag"></<span class="hljs-name">label</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="19"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"checkbox"</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"hobby"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"3"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"game"</span>></span> <span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"game"</span>></span>游戏<span class="hljs-tag"></<span class="hljs-name">label</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="20"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="21"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="22"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> 头像:</div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="23"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"file"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="24"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="25"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="26"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> 城市:</div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="27"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">select</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"city"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="28"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">option</span>></span>北京<span class="hljs-tag"></<span class="hljs-name">option</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="29"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">option</span>></span>上海<span class="hljs-tag"></<span class="hljs-name">option</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="30"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">option</span>></span>深圳<span class="hljs-tag"></<span class="hljs-name">option</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="31"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">select</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="32"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="33"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="34"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> 个人描述:</div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="35"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">textarea</span> <span class="hljs-attr">cols</span>=<span class="hljs-string">"20"</span> <span class="hljs-attr">rows</span>=<span class="hljs-string">"5"</span>></span><span class="hljs-tag"></<span class="hljs-name">textarea</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="36"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="37"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="38"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">br</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="39"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"submit"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"免费注册"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="40"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="41"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"reset"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"重置"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="42"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="43"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"button"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"一个按钮"</span>></span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="44"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="45"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag"></<span class="hljs-name">form</span>></span></div></div></li></ol></code><div class="hide-preCode-box"><span class="hide-preCode-bt" data-report-view="{"spm":"1001.2101.3001.7365"}"><img class="look-more-preCode contentImg-no-view" src="https://1000bd.com/contentImg/2022/06/27/191644837.png" alt="" title=""></span></div><div class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)"></div></pre> <p></p> </div> </div> </li> <li class="list-group-item ul-li"> <b>相关阅读:</b><br> <nobr> <a href="/Article/Index/1180643">[附源码]Python计算机毕业设计Django高校流浪动物领养网站</a> <br /> <a href="/Article/Index/804684">关于项目的相关测试</a> <br /> <a href="/Article/Index/738596">专利说明书怎么写？</a> <br /> <a href="/Article/Index/644755">难怪大家丢掉了postman而选择 Apifox</a> <br /> <a href="/Article/Index/1180294">[附源码]计算机毕业设计JAVA校园跑腿系统</a> <br /> <a href="/Article/Index/1303901">网络爬虫-----http和https的请求与响应原理</a> <br /> <a href="/Article/Index/1255648">js去除字符串空格的几种方式</a> <br /> <a href="/Article/Index/1292746">【文件上传-配置文件】crossdomain.xml跨域策略配置文件上传</a> <br /> <a href="/Article/Index/1521659">[Vue] 自定义命令</a> <br /> <a href="/Article/Index/1476036">基于SSM的学生档案管理系统设计与实现</a> <br /> </nobr> </li> <li class="list-group-item from-a mb-2"> 原文地址：https://blog.csdn.net/2301_80460489/article/details/136421811 </li> </ul> </div> <div class="col-lg-4 col-sm-12"> <ul class="list-group" style="word-break:break-all;"> <li class="list-group-item ul-li-bg" aria-current="true"> 最新文章 </li> <li class="list-group-item ul-li"> <nobr> <a href="/Article/Index/1484446">攻防演习之三天拿下官网站群</a> <br /> <a href="/Article/Index/1515268">数据安全治理学习——前期安全规划和安全管理体系建设</a> <br /> <a href="/Article/Index/1759065">企业安全 | 企业内一次钓鱼演练准备过程</a> <br /> <a href="/Article/Index/1485036">内网渗透测试 | Kerberos协议及其部分攻击手法</a> <br /> <a href="/Article/Index/1877332">0day的产生 | 不懂代码的"代码审计"</a> <br /> <a href="/Article/Index/1887576">安装scrcpy-client模块av模块异常，环境问题解决方案</a> <br /> <a href="/Article/Index/1887578">leetcode hot100【LeetCode 279. 完全平方数】java实现</a> <br /> <a href="/Article/Index/1887512">OpenWrt下安装Mosquitto</a> <br /> <a href="/Article/Index/1887520">AnatoMask论文汇总</a> <br /> <a href="/Article/Index/1887496">【AI日记】24.11.01 LangChain、openai api和github copilot</a> <br /> </nobr> </li> </ul> <ul class="list-group pt-2" style="word-break:break-all;"> <li class="list-group-item ul-li-bg" aria-current="true"> 热门文章 </li> <li class="list-group-item ul-li"> <nobr> <a href="/Article/Index/888177">十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧！！！</a> <br /> <a href="/Article/Index/797680">奉劝各位学弟学妹们，该打造你的技术影响力了！</a> <br /> <a href="/Article/Index/888183">五年了，我在 CSDN 的两个一百万。</a> <br /> <a href="/Article/Index/888179">Java俄罗斯方块，老程序员花了一个周末，连接中学年代！</a> <br /> <a href="/Article/Index/797730">面试官都震惊，你这网络基础可以啊！</a> <br /> <a href="/Article/Index/797725">你真的会用百度吗？我不信 — 那些不为人知的搜索引擎语法</a> <br /> <a href="/Article/Index/797702">心情不好的时候，用 Python 画棵樱花树送给自己吧</a> <br /> <a href="/Article/Index/797709">通宵一晚做出来的一款类似CS的第一人称射击游戏Demo！原来做游戏也不是很难，连憨憨学妹都学会了！</a> <br /> <a href="/Article/Index/797716">13 万字 C 语言从入门到精通保姆级教程2021 年版</a> <br /> <a href="/Article/Index/888192">10行代码集2000张美女图，Python爬虫120例，再上征途</a> <br /> </nobr> </li> </ul> </div> </div> </div> <!-- 主体 --> <!--body结束--> <!--这里是footer模板--> <!--footer--> <nav class="navbar navbar-inverse navbar-fixed-bottom"> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="text-muted center foot-height"> Copyright © 2022 侵权请联系<a href="mailto:2656653265@qq.com">2656653265@qq.com</a> <a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2022015340号-1</a> </div> <div style="width:300px;margin:0 auto; padding:0px 5px;"> <a href="/regex.html">正则表达式工具</a> <a href="/cron.html">cron表达式工具</a> <a href="/pwdcreator.html">密码生成工具</a> </div> <div style="width:300px;margin:0 auto; padding:5px 0;"> <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010502049817" style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"> <img src="" style="float:left;" /><p style="float:left;height:20px;line-height:20px;margin: 0px 0px 0px 5px; color:#939393;">京公网安备 11010502049817号</p></a> </div> </div> </div> </div> </nav> <!--footer--> <!--footer模板结束--> <script src="/js/plugins/jquery/jquery.js"></script> <script src="/js/bootstrap.min.js"></script> <!--这里是scripts模板--> <!--scripts模板结束--> </body> </html>