<!DOCTYPE html><html lang="en"><head> <!--meta是自闭合标签 属性：name="keywords" 描述网站的关键字 属性name="description" 网站内容的大致描述 属性http-equiv="Refresh" 刷新网站 --> <!--<meta name="keywords",--> <!--content="网站关键字">-->
<!--<meta name="description"--> <!--content="网站描述">-->
<!--2秒钟后跳转到www.baidu.com,如果不添加网站则没2秒钟刷新一次网站--> <!--<meta http-equiv="refresh"--> <!--content="2;URL=https://www.baidu.com">-->
<!--<meta http-equiv="refresh"--> <!--content="2">-->
<!--定义文档编码方式--> <meta http-equiv="content-type" charset="UTF-8"> <!--IE浏览器专用定义兼容模式--> <!--<meta http-equiv="X-UA-COMPATIBLE" CONTENT="IE-EmulateIE7">--> <!--网站显示名称-->
<title>抽屉测试页面</title>
<!--网站图标icon设置--> <link rel="icon" href="chouti.ico">
<!--css和js代码也放到head标签里面--> <!--css代码第二种方式--> <style> /*div{*/ /*color: red;*/ /*background: green;*/ /*}*/ /*span{*/ /*color: green;*/ /*background: indianred;*/ /*}*/ #div1{ height: 500px; background: orange; } #div2{ height: 600px; background: orangered; } #div3{ height: 700px; background: coral; } </style> <script></script>
</head><body> <!--h标签是块标签--> <!--<h1>This is H1...</h1>--> <!--<h2>This is H2...</h2>--> <!--<h3>This is H3...</h3>--> <!--<h4>This is H4...</h4>--> <!--<h5>This is H5...</h5>--> <!--<h6>This is H6...</h6>-->
<!--br标签是in-line标签--> <!--将进酒·君不见<br><hr>--> <!--君不见，黄河之水天上来，奔流到海不复回。<br><hr>--> <!--君不见，高堂明镜悲白发，朝如青丝暮成雪。<br><hr>--> <!--人生得意须尽欢，莫使金樽空对月。<br><hr>--> <!--天生我材必有用，千金散尽还复来。<br><hr>-->
<!--div标签无任何text渲染,css代码第一种方式 div是块级标签，独占一行 --> <!--<div style="color: red;">Hello div...!</div>--> <!--Hello Before--> <!--<div>Hello div1...</div><div>hello div2...</div>Hello After-->
<!--span标签与div标签一样,无任何text渲染,css代码第一种方式--> <!--<span style="color: greenyellow;">Hello span!</span> span标签是内联标签, --> <!--<span>Hello span!</span>-->
<!--所有的标签都可以划分到块级标签和内联标签两类里面-->
<!--p标签也是块级标签，换行和隔行的作用，其他与div类似--> <!--<p>hello p1...</p> <p>hello p2...</p>--> <!--<p>--> <!--以下标签以后都用css替代--> <!--<b>b标签给字体加粗</b>--> <!--<em>em标签将字体变成斜体</em>--> <!--<strike>strike给字体添加删除线</strike>--> <!--<del>del标签与strike标签一样</del>--> <!--s<sub>3</sub>--> <!--s<sup>3</sup>--> <!-- 代表空格©代表版权符号<小于>大于--> <!--Hello World!©<h1>--> <!--</p>-->
<!--img标签显示图片 src属性控制路径, width控制长度, height控制高度 alt属性控制加载失败后的提示内容, title属性控制光标悬浮状态下的显示内容 --> <!--<img src="美女1.jpg"--> <!--width="500px"--> <!--height="700"--> <!--alt="美女"--> <!--title="美女"--> <!-->-->
<!--<p></p>--> <!--a标签提供的功能之一是：超链接，另一个重要的功能是锚 href属性控制超链接地址以及要定位的其他页面 target属性控制新窗口跳转 没有target属性则表示本地跳转 -->
<!--<a href="https://www.jd.com" target="_blank">--> <!--<b>京东</b>--> <!--</a>--> <!--<a href="https://www.jd.com">--> <!--<b>京东</b>--> <!--</a>--> <!--<div id="div_top">Top</div>--> <!--<a href="#div1">第一章</a>--> <!--<a href="#div2">第二章</a>--> <!--<a href="#div3">第三章</a>-->
<!--<div id="div1">第一章</div><a href="#div_top">返回</a>--> <!--<div id="div2">第二章</div><a href="#div_top">返回</a>--> <!--<div id="div3">第三章</div><a href="#div_top">返回</a>-->
<!--ul：不排序标签，ul标签里面固定嵌套li标签--> <!--<ul>--> <!--<li>1</li>--> <!--<li>2</li>--> <!--<li>3</li>--> <!--</ul>-->
<!--ol: 排序标签，ol标签里面也固定嵌套li标签--> <!--<ol>--> <!--<li>1</li>--> <!--<li>2</li>--> <!--<li>3</li>--> <!--</ol>-->
<!--dl: 定义列表 dt: 标题 dd: 数据 --> <!--<dl>--> <!--<dt>第一章</dt>--> <!--<dd>content</dd>--> <!--<dt>第二章</dt>--> <!--<dd>content</dd>--> <!--</dl>-->
<!--form表单用户向服务器传送数据 method属性控制客户端向服务端提交数据的方式 get方式提交的键值对，放在地址栏url，提交的内容长度有限制，安全性相对较差 post方式提交的键值对，放在请求体里面，安全性相对较高，提交的内容长度理论上没有限制 这两种提交方式在服务器端都是字典的形式接收，一般form表单提交都是以post方式 action属性控制提交的目的地址 --> <!--<form action="127.0.0.1:8080/index" method="get">--> <!--input标签是自闭合标签 type属性控制输入的类型 name属性是提交给服务器的 --> <!--<p>输入框名称：<input type="text"></p>--> <!--<p>姓名：<input type="text" name="username"></p>--> <!--<p>密码：<input type="password" name="password"></p>--> <!--<p>爱好：篮球<input type="checkbox" name="hobby" value="1">--> <!--足球<input type="checkbox" name="hobby" value="2"></p>--> <!--<p>性别：男<input type="radio" name="gender">--> <!--女<input type="radio" name="gender"></p>--> <!--<p>所在城市：--> <!--<select name="city" multiple="multiple" size="5">--> <!--<optgroup label="北京">--> <!--<option value="chaoyang">朝阳</option>--> <!--<option value="chaoyang">海淀</option>--> <!--<option value="chaoyang">东城</option>--> <!--<option value="chaoyang">西城</option>--> <!--</optgroup>--> <!--<optgroup label="湖南">--> <!--<option value="changsha">长沙</option>--> <!--<option value="yueyang">岳阳</option>--> <!--<option value="zhuzhou">株洲</option>--> <!--<option value="xiangtan">湘潭</option>--> <!--</optgroup>--> <!--</select>--> <!--</p>--> <!--<p>自我简介：--> <!--<textarea rows="10" cols="50">正文</textarea>--> <!--<label for="qualifications">学历</label>--> <!--<input id="qualifications" type="text">--> <!--<label for="school">学校</label>--> <!--<input id="school" type="text">--> <!--</p>--> <!--<p>证件：<input type="file"></p>--> <!--<p>重置：<input type="reset" value="reset"></p>--> <!--<p>提交：<input type="submit" value="press"></p>--> <!--<p>提交：<input type="button" value="button由js中的事件触发"></p>--> <!--</form>-->
</body></html>
时间： 2025-01-11 16:15:01