## 基础语法 ``` 加粗 斜体 下划线 删除线 下标 上标 字体字形字号以及颜色 标题1居中对齐 标题2居左对齐 标题3居右对齐 标题4(不写默认左对齐) 标题5 标题6 段落 换行 以代码中的原格式效果显示 块内元素(后面隐藏带有换行符)(全宽) 行内元素(无固定宽度) 有序列表123 无序列表··· 标签:显示内容与原格式相同 1 2 多行文本 ``` ## 链接标签 ``` 显示的文本或图像 下载压缩文件 发邮件 目标内容 超链接文本或图像 当前窗口打开 新窗口打开 ``` ## 表格标签 ``` 账号: 密码: 单选:1 2 多选: ``` ## 空格代码 ``` :一个字符的半角的不断行的空格,如果需要在网页中插入多个空格,可以将“ ”代码写多遍; :一个字符的半角的空格,也可以将“ ”写多遍来插入多个空格; :两个字符的全角的空格,也可以将“ ”写多遍来插入更多的空格; :小于一个字符的空格; ``` ## 路径说明 ``` 绝对路径:通信协议名+服务器名+路径及文件名的完全路径 相对路径:指向相同目录:文件名; 指向子目录:/目标文件/文件名; 指向上级文件:../上一级目录/文件名; ``` ## 表格标签 ``` 标签:每一个表格只有一对和 ,—张页面中可以有多个表格,表格可以嵌套。 width="100%" height="100%" 定义宽和高 border="0"定义边框 cellspacing="3"单元格之间空格 标签:定义表格的行,一个表格可以有多行。 标签:定义表格的一个单元格。每行可以有不同数量的单元格。 ``` ## 多媒体 ``` 视频 您的浏览器不支持此标签 音频 ``` ## 语义标签 ``` 可见部分隐藏部分 标签规定独立的流内容(图像、图表、照片、代码等等)图片名 高亮部分 2/10 20/100 汉字hanzi拼音pinyin ```  ## canvas画布 ``` 浏览器不支持canvas画布 ``` 基础语法 <b>加粗</b> <i>斜体</i> <u>下划线</u> <s>删除线</s> <sub>下标</sub> <sup>上标</sup> <font face="宋体" size="1" color="#003366">字体字形字号以及颜色</font> <h1 align="center">标题1居中对齐</h1> <h2 align="left">标题2居左对齐</h2> <h3 align="right">标题3居右对齐</h3> <h4>标题4(不写默认左对齐)</h4> <h5>标题5</h5> <h6>标题6</h6> <p>段落</p> <br>换行 <pre>以代码中的原格式效果显示</pre> <div>块内元素(后面隐藏带有换行符)(全宽)</div> <span>行内元素(无固定宽度)</span> <ol type="A"(type决定有序列表类型)>有序列表<li>1</li><li>2</li><li>3</li></ol> <ul type="disc/circle/square"(type决定无序列表类型)>无序列表<li>·</li><li>·</li><li>·</li></ul> <pre></pre>标签:显示内容与原格式相同 <select name="sel"> <optgroup label="下拉选项"> <option value="1">1</option> <option value="2">2</option> </optgroup> </select> <p>多行文本<br> <textarea cola="50" rows="5"> </textarea> </p> <img src="文件名" alt="找不到目标文件后显示的文字" width="200" height="100"> 链接标签 <a href="url">显示的文本或图像</a> <a href="xx.zip">下载压缩文件</a> <a href="mailto:XXX@XXX.com">发邮件</a> <a name="锚点名">目标内容</a> <a href="#锚点名">超链接文本或图像</a> <a href="url" target="_self">当前窗口打开</a> <a href="url" target="_blank">新窗口打开</a> 表格标签 <from action="html_forn_action.php" method="post"> <p>账号:<input type="text" name="user"></p> <p>密码:<input type="password" name="password"></p> <p><input type="submit" value="提交"></p> <p><input type="reset" value="重置"></p> <p>单选:<input type="radio" name="xxx" value="1">1 <input type="radio" name="xxx" value="2">2</p> <p>多选:<input type="checkbox" name="xxx" value="1"><input type="checkbox" name="xxx" value="2"></p> </from> 空格代码 :一个字符的半角的不断行的空格,如果需要在网页中插入多个空格,可以将“ ”代码写多遍; :一个字符的半角的空格,也可以将“ ”写多遍来插入多个空格; :两个字符的全角的空格,也可以将“ ”写多遍来插入更多的空格; :小于一个字符的空格; 路径说明 绝对路径:通信协议名+服务器名+路径及文件名的完全路径 相对路径:指向相同目录:文件名; 指向子目录:/目标文件/文件名; 指向上级文件:../上一级目录/文件名; 表格标签 <table>标签:每一个表格只有一对<table>和 </table>,—张页面中可以有多个表格,表格可以嵌套。 width="100%" height="100%" 定义宽和高 border="0"定义边框 cellspacing="3"单元格之间空格 <tr>标签:定义表格的行,一个表格可以有多行。 <td>标签:定义表格的一个单元格。每行可以有不同数量的单元格。 多媒体 <video src="" controls="controls"播放 width="500" height="500" 定义宽和高 preload="auto" muted静音 autoplay="autoplay"自动播放 loop="loop"循环播放poster=""视频图片>视频 <source src="video.ogg" type="video/ogg"> <source src="video.mp4" type="video/mp4"> <source src="video.webm" type="video/webm"> 您的浏览器不支持此标签</video> <audio src="" controls="controls"播放 preload="auto" muted静音 autoplay="autoplay"自动播放 loop="loop"循环播放>音频 语义标签 <details (open默认打开)><summary>可见部分</summary>隐藏部分</details> <figure>标签规定独立的流内容(图像、图表、照片、代码等等)<figcaption>图片名</figcaption></figure> <mark>高亮部分</mark> <meter value="2" min="0" max="10">2/10</meter> <progress value="20" max="100">20/100</progress> <ruby>汉字<rt>hanzi</rt>拼音<rt>pinyin</rt></ruby> <wbr></wbr><time></time><dialogue></dialogue><command></command> canvas画布 <canvas id="myCanvas" width="600" height="300" style="border:1px solid #c3c3c3;"> 浏览器不支持canvas画布 </canvas> <script type="test/javascript"> var c=document.getElementById("myCanvas"); var cxt=c.getContext("2d"); cxt.fillStyle="#FF0000"; cxt.fillRect(0,0,300,150); </script> <script type="test/javascript"> var c=document.getElementById("myCanvas"); var cxt=c.getContext("2d"); cxt.moveTo(10,290); cxt.lineTo(60,190); cxt.lineTo(110,230); cxt.lineTo(180,150); cxt.stoke(); </script> 最后修改:2023 年 07 月 21 日 © 禁止转载 打赏 赞赏作者 支付宝微信 赞 如果觉得我的文章对你有用,请随意赞赏 文章引用 反向引用 Loading... 暂未引用其他文章 暂未被其它文章引用 下一篇 上一篇 发表评论 取消回复 使用cookie技术保留您的个人信息以便您下次快速评论,继续评论表示您已同意该条款 评论 * 私密评论 名称 * 🎲 邮箱 * 地址 发表评论 提交中... HTML学习笔记 htyed • 2020 年 08 月 28 日 文章目录