|
<!DOCTYPE html> <html lang="en"> <!-- <html lang="zh-cn">简体中文 --> <head> <meta charset="utf-8"> <!-- <meta http-equiv="Refresh" Content="3"> <!-- 每3秒刷新一次 --> <meta http-equiv="Refresh" Content="3;Url=https:\\www.baidu.com"> <!-- 每3秒刷新一次到指定网址 --> <meta name="keywords" content="职友集，雇主点评，公司点评" /> <!-- 关键词 --> <meta name="description" content="职友集通过公司概况、招聘、薪酬福利、办公环境、新闻、产品与服务、融资、网友点评等，帮你发现和了解你未来的雇主。" /> <!--描述--> <meta http-equiv="X-UA-Compatible" content="IE=edge"><!--以高版本IE模式打开--> <title>HTML学习</title> <link type="image/x-icon" href="http://htm4.jobui.com/template_1/images/favicon.ico"><!--图标--> <style type="text/css"> /*CSS代码*/ </style> <script type="text/javascript"> // javascript代码 </script> </head> <body> <!-- {% block html %}{% endbock %} --> <!-- {% include 'base.html' %} --> <b>加粗</b> <br> <strong>强调</strong> <wbr>安全换行 <wbr> <i>倾斜</i> <s>删除线</s> <del>强调删除线</del> <u>下划线</u> <ins>强调下划线</ins> <small>变小</small> <sup>上标</sup> <sub>下标</sub> <code>代码</code> <var>倾斜</var> <samp>样本文本</samp> <kbd>用户输入</kbd> <abbr>缩写</abbr> <dfn>术语</dfn> <q>双引号</q> <cite>引用标题</cite> <ruby style="font-size: 20px;"><rp>张</rp><rt>(zhang)</rt>美(mei)德(de)</ruby> <br> <bdo dir="rtl">从右往左</bdo> <mark>记号</mark> <time>2017-5-17</time> <span>一般文本(行内标签)(白板)</span> <a href="https://www.baidu.com/" target="_blank">百度一下</a> <a href="#1">第一章</a> <!--锚:href="#1",#号加id号--> <a href="#2">第二章</a> <a href="#3">第三章</a> <a name="1">第一章内容</a> <a id="2">第二章内容</a> <a name="3">第三章内容</a> <p>段落(块级标签)</p> <h1>大标题(块级标签)</h1> <div>分组</div> <blockquote>有缩进的段落</blockquote> <pre>展现原来格式</pre> <hr>分隔水平线 <ul> <li>无序列表</li> </ul> <ol start="2" reversed type="i"> <li value="3">有序列表</li> </ol> <dl> <dt>标题</dt> <dd>内容</dd> </dl> <figure> <figcaption>图片</figcaption> <img src="QQ拼音截图20170506231223.png_temp" title="停留显示标题" style="height:200px;width:200px;" alt="图片不存在时显示标题"> </figure> <table border="1" style="width:1000px"> <caption>表格标题</caption> <colgroup style="background:red;" span="1">设置一列颜色</colgroup> <colgroup> <col> <col style="background:red;"> </colgroup> <tr> <td rowspan="3">纵向表格合并</td> <th colspan="2">第一个字段名(标题单元格)</th> <th colspan="2">第二个字段名(标题单元格)</th> </tr> <tr style="background: red;"> <td>第一个表格单元格</td> <td>第二个表格单元格</td> </tr> <thead>表头位置设置</thead> <tbody>表体部分</tbody> <tfoot>表尾位置设置</tfoot> </table> <header>头部</header> <footer>尾部</footer> <h1>大标题</h1> <section>主题</section> <nav>导航</nav> <article>文章(头、主体、尾)</article> <aside>注释</aside> <address>联系信息</address> <details>详情区域</details> <img src="" width="100" height="80"></img> <a href="http://www.baidu.com" target="in">百度</a> <a href="http://www.2345.com" target="in">2345</a> <iframe src="http://www.hao123.com" width="900" height="600" name="in">超链接窗口</iframe> <embed src="http://www.iqiyi.com/v_19rr782qec.html" width="800" height="600">视频窗口</embed> <progress value="30" max="100">进度条</progress> <meter value="30" min="10" max="100" low="40" high="80" optimum="60">显示范围值</meter> <video src="F:\视频\MC\759878496687048386.mp4" width="800" height="600" controls="" autoplay="" loop="" muted="" poster="图片地址" preload="auto"></video> <video width="100" height="80" controls=""> <source src="F:\视频\MC\759878496687048386.mp4" type=""> <source src="F:\视频\MC\759878496687048386.webm" type="">多浏览器播放 <object>多浏览器播放</object> </video> <audio src="音频地址" controls=""></audio> <form method="get" action="http://www.baidu.com" target="_blank" autocomplete="off" enctype="multiple/form-data"> <fieldset><!--加外边框包裹起来--> <legend>注册分组</legend> <label> 用户名：<input type="" maxlength="10" size="30" value="默认值" name="user" autofocus=""><!-- disabled="">--> </label> <label for="user">用户名:</label><!--for=id,点击label,input处于编辑状态--> <input id='user' type="" name="user" autofocus=""><!-- disabled="">--> <input type="" name="" list="list" required=""> <input type="password" name="" placeholder="请输入密码"> <input type="search" name=""><!--name属性提交数据给后台(字典形式)--> <input type="number" min="10" max="20" step="2" name=""> <input type="date" name=""> <input type="month" name=""> <input type="time" name=""> <input type="week" name=""> <input type="datetime" name=""> <input type="datetime-local" name=""> <input type="color" name="color"> 音乐(复选框) <input type="checkbox" name="music" value="1"> <input type="radio" name="sex" value="1" checked="checked">男 <!--checked:默认被选中,radio:单选框,value值提交到后台&sex=1--> <input type="radio" name="sex" value="2">女<!--name相同的互斥--> <input type="image" name="" src="img.png"> <input type="hidden" value="1" name="id"> <input type="file" accept="image/dif" name=""> <!--file提交文件,以name接收文件,在form中加上enctype="multiple/form-data"才能提交--> <button type="submit">提交</button> <button type="reset">重置</button> <button type="button">按钮</button> </fieldset> </form> <datalist id="list"> <option value="1">苹果</option> <option value="2">桔子</option> <option value="3" label="香蕉"> <option value="菠萝"> </datalist> <form action="http://www.li."> <select name="fruit" size="10" multiple=""> <!--选择下拉框--> <optgroup label="水果"> <option value="1">苹果</option> <option value="2" selected="">香蕉</option> </optgroup> <optgroup label="粗粮"> <option value="3">小米</option> <option value="4" selected="">玉米</option> </optgroup> <textarea name="content" rows="10" cols="10" wrap="hard">请留下您的建议！</textarea><!--多行文本输入--> </select> <button>提交</button> </form> <div> 空 格 版权© <p contenteditable="true">修改</p> <p dir="rtl">右对齐</p> <p hidden="">隐藏</p> <p lang="en" title="提示">英文样式</p> <p style="color: red;font-size: 20px;">字体颜色、大小</p> CSS学习 <style type="text/css"> p{ color: red; font-size: 30px; } </style> <p id="abc">ID选择器</p> <p class="abd">类选<b>择</b>器</p> <link rel="stylesheet" type="text/css" href="style.css"><!--引入CSS样式--> <div>盒模型</div> 事件：onclick onblur onfocus <div onclick="func();">点击这个div执行func函数</div> <script src="javascript.js"></script> <!--javascript.js是javascript文件路径--> <!-- JS加载需要时间，一般放在最下面 --> </body> </html>
|
|
|
