Html手写代码笔记

合集下载

HTML5Canvas学习笔记（canvas绘制线条、矩形、多边形、圆、自定义图像）

HTML5Canvas学习笔记（canvas绘制线条、矩形、多边形、圆、⾃定义图像）⼀、对 canvas 的理解 <canvas>标签是 HTML5 中的新标签，像所有的 dom 对象⼀样它有⾃⼰本⾝的属性、⽅法和事件。

canvas 是⽤来在⽹页上绘制图形的（我们通常称之为画布），canvas 只是图形容器，需要使⽤ js 脚本来绘制图形，可以绘制线条、矩形、多边形、圆形、圆环、组合图形、⽂字、⾃定义图像等。

浏览器⽀持注释：Internet Explorer 8 以及更早的版本不⽀持 <canvas> 标签。

Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari ⽀持 <canvas>标签。

⼆、基本⽅法绘图环境：语法 Canvas.getContext(contextID) 参数contextID指定了您想要在画布上绘制的类型。

当前唯⼀的合法值是 "2d"，它指定了⼆维绘图，并且导致这个⽅法返回⼀个环境对象，该对象导出⼀个⼆维绘图API。

【注】：getContext() ⽅法返回⼀个⽤于在画布上绘图的环境。

getContext("2d") 对象是内建的 HTML5 对象，拥有多种绘制路径、矩形、圆形、字符以及添加图像的⽅法。

绘制图形样式style（⼀般在绘制图形前先进⾏样式设定）：context.fillStyle //填充样式context.strokeStyle //笔触颜⾊context.lineWidth //边框宽度绘制图像有两种⽅法：context.fill() //填充context.stroke() //绘制边框颜⾊的表⽰⽅式:颜⾊名称:"red" "green" "blue"⼗六进制颜⾊值: "#FFFFFF"三⾊值：rgb(1-255,1-255,1-255)四⾊值：rgba(1-255,1-255,1-255,透明度)三、使⽤ <canvas> Step1: ⾸先在html页⾯中添加<canvas>标签，规定好画布的id和尺⼨，代码如下：<canvas id="myCanvas" width="400" height="300"/> Step2: 通过JavaScript来进⾏绘制：⽅法⼀：<script src="canvas.js"></script> ⽅法⼆：<script type="text/javascript"> var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("2d"); context.fillStyle = "#FF0000"; context.fillRect(50,50,150,100);</script> 图解： Step3: Step2 分步骤：通过id来捕获canvas元素创建 context 对象指定 fillStyle 填充颜⾊为红⾊指定 fillRect ：fillRect(起始点x轴坐标, 始点y轴坐标, 宽度, ⾼度);四、实例1--绘制线条： context.moveTo(x,y) context.lineTo(x,y)x:x坐标y:y坐标起点 moveTo 的点到终点 lineTo 的点之间画⼀条直线如果没有moveTo那么第⼀次lineTo的效果和moveTo⼀样每次lineTo后如果没有moveTo，那么下次lineTo的开始点为前⼀次lineTo的结束点1 1 // 绘制对⾓线2 2 function demo1(id){3 3 var canvas = document.getElementById(id);4 4 var context = canvas.getContext("2d");5 5 6 6 context.strokeStyle = "#ff0000";7 78 8 context.moveTo(0,0);9 9 context.lineTo(200,100);10 10 context.stroke();11 11 }View Code实例结果：1// 绘制直⾓三⾓形2function demo1(id){3var canvas = document.getElementById(id);4 var context = canvas.getContext("2d");5 6 context.strokeStyle = "#ff0000";78 context.lineTo(20, 20);9 context.lineTo(20, 70);10 context.lineTo(70, 70);11 context.lineTo(20, 20);12 context.stroke();13 }View Code【注】：1. 三⾓形有三个点，但在连线的时候还需要连回顶点；2. 最后⼀定记得加上 stroke(); 初学时容易犯这个⽑病，这相当于你把点定好了，却没⽤线连起来，岂不......实例结果：CSS属性中有⼀圆⾓设置 radius，canvas画线段也要达到这种圆⾓匾额效果，我么也有相应的办法： lineJoin 属性,可以设置线的交汇处的样式，lineJoin有3个属性值：miter(尖⾓，默认)，bevel（斜⾓）,round（圆⾓） lineCap 属性，定义线条的端点。

HTML基础代码大全

HTML基础代码⼤全1。

忽视右键　<body oncontextmenu="return false">　或　<body style="overflow-y:hidden">2。

加⼊背景⾳乐　ie:<bgsound src="*.mid" loop=infinite>　ns:<embed src="*.mid" autostart=true hidden=true loop=true>　</embed>　*.mid你的背景⾳乐的midi格式⽂件3。

简单的window.open⽅法　<a href="#"　onclick="javascript:window.open(⽂件路径/⽂件名,newwindow,　toolbar=no,scrollbars=yes,resizable=no,top=0,left=0,　width=400,height=300);">⽂字或图⽚</a>　参数解释：　<script language="javascript"> 脚本开始；　window.open 弹出新窗⼝的命令；　⽂件路径/⽂件名弹出窗⼝的⽂件名；　newwindow 弹出窗⼝的名字（不是⽂件名），⾮必须，可⽤空代替；　width=400 窗⼝宽度；　height=300 窗⼝⾼度；　top=0 窗⼝距离屏幕上⽅的象素值；　left=0 窗⼝距离屏幕左侧的象素值；　toolbar=no 是否显⽰⼯具栏，yes为显⽰；　menubar，scrollbars 表⽰菜单栏和滚动栏。

　resizable=no 是否允许改变窗⼝⼤⼩，yes为允许；　location=no 是否显⽰地址栏，yes为允许；　status=no 是否显⽰状态栏内的信息（通常是⽂件已经打开），yes为允许；　</script> 脚本结束4。

HTML5+CSS3笔记

HTML5一、HTML5 概述二、HTML5基本格式一．HTML5 文档结构1.第一步：打开Sublime Text 3，打开指定文件夹；2.第二步：保存index.html 文件到磁盘中，.html 是网页后缀；3.第三步：开始编写HTML5 的基本格式。

<!DOCTYPE html> //文档类型声明<html lang="zh-cn"> //表示HTML 文档开始<head> //包含文档元数据开始<meta charset="utf-8"> //声明字符编码<title>基本结构</title> //设置文档标题</head> //包含文档元数据结束<body> //表示HTML 文档内容<a href="">百度</a> //一个超链接元素（标签）</body> //表示HTML</html> //表示HTML 文档结束二．文档结构解析1.Doctype文档类型声明（Document Type Declaration，也称Doctype）。

它主要告诉浏览器所查看的文件类型。

在以往的HTML4.01 和XHTML1.0 中，它表示具体的HTML 版本和风格。

而如今HTML5 不需要表示版本和风格了。

<!DOCTYPE html> //不分区大小写2.html 元素首先，元素就是标签的意思，html 元素即html 标签。

html 元素是文档开始和结尾的元素。

它是一个双标签，头尾呼应，包含内容。

这个元素有一个属性和值：lang="zh-cn"，表示文档采用语言为：简体中文。

<html lang="zh-cn"> //如果是英文则为en3.head 元素用来包含元数据内容，元数据包括：<link>、<meta>、<noscript>、<script>、<style>、<title>。

HTML5学习笔记--------》HTML5概要与新增标签！

HTML5学习笔记--------》HTML5概要与新增标签！⼀、HTML5概要1.1、为什么需要HTML5HTML4陈旧不能满⾜⽇益发展的互联⽹需要，特别是移动互联⽹。

为了增强浏览器功能Flash被⼴泛使⽤，但安全与稳定堪忧，不适合在移动端使⽤（耗电、触摸、不开放）。

HTML5增强了浏览器的原⽣功能，符合HTML5规范的浏览器功能将更加强⼤，减少了Web应⽤对插件的依赖，让⽤户体验更好，让开发更加⽅便，另外W3C从推出HTML4.0到5.0之间共经历了17年，HTML的变化很⼩，这并不符合⼀个好产品的演进规则。

1.2、什么是HTML5HTML5指的是包括HTML、CSS和JavaScript在内的⼀套技术组合。

它希望能够减少⽹页浏览器对于需要插件的丰富性⽹络应⽤服务（Plug-in-Based Rich Internet Application，RIA），例如：AdobeFlash、Microsoft Silverlight与Oracle JavaFX的需求，并且提供更多能有效加强⽹络应⽤的标准集。

HTML5是HTML最新版本，2014年10⽉由万维⽹联盟（W3C）完成标准制定。

⽬标是替换1999年所制定的HTML 4.01和XHTML 1.0标准，以期能在互联⽹应⽤迅速发展的时候，使⽹络标准达到匹配当代的⽹络需求。

1.3、HTML5现状及浏览器⽀持⼤部分主流浏览器已经⽀持HTML5，但是各个浏览器⽀持的⽅式以及语法有所差异性。

⽀持Html5的浏览器包括Firefox（⽕狐浏览器），IE9 及其更⾼版本，Chrome（⾕歌浏览器），Safari，Opera等现代浏览器。

⽀持得分：如果想了解更多请看本⽂的兼容性那⼀节的内容。

PC端（总分555分）：平板（总分555分）：移动（总分555分）：1.4、HTML5特性HTML5 ⼋个特性类别对应的8个Logo 语义⽹、离线&存储、设备访问、通信多媒体、图形和特效、性能和集成、呈现（CSS3）1.4.1. 语义特性（Class：Semantic）HTML5赋予⽹页更好的意义和结构。

html5离线记事本

html5离线记事本这是⼀个笔记应⽤,不需要联⽹,也不需要数据库,可以直接把数据储存在本地.⽅便易⽤!^_^离线记事本1. <!DOCTYPE html>2. <html>3. <head>4. <meta charset ="UTF-8">5. <title>记事本</title>6. <script src ="/libs/jquery/2.1.4/jquery.min.js"></script>7. <style>8. *{ margin : 0; padding : 0; box-sizing : border-box; font-family : 'Microsoft Yahei'; font-size : 14px ; box-sizing : border-box;}9. h1{text-align : center; font-size : 26px ; line-height : 60px ;color : #ff8140;}10. .main {margin : 10px auto;w idth : 1000px ; overflow : hidden; height : 500px ;padding : 1%;border : 1px solid #ddd ; border-radius : 5px ;}11. input{ width: 92%; padding: 5px; outline: none;border: 1px solid #eee;}12. textarea{ width: 100%; overflow: hidden; padding: 5px; outline: none; resize:none; }13. textarea:focus,input:focus{ border-color: #f77c3d; }14. .write{padding: 10px; border-radius: 3px; background: #eee; overflow: hidden; float: left;width: 48%;}15. .send{ background: #ff8140; border: 1px solid #f77c3d; color: #fff; box-shadow: 0px1px2px rgba(0, 0, 0, 0.25);16. width: 80px; height: 30px; text-align: center; line-height: 30px; border-radius: 3px; float: right; cursor: pointer; }17. .list{padding: 10px; float: left;width: 50%;}18. .item{padding: 10px;border: 1px solid #eee;border-radius: 3px;margin-bottom: 10px;}19. .item.content{padding: 20px10px;word-break:break-all;background: #fff; display: none;}20. .title{padding-bottom: 5px;border-bottom: 1px solid #eee;cursor: pointer;}21. .title span{color: #999; font-size: 12px;float: right;}22. #noteList{overflow-y: scroll;height: 350px;box-shadow: 003px#ddd;}23. </style>24. </head>25. <body>26. <h1>记事本</h1>27. <div class="main">28. <div class="write"id="write">29. 标题: <input id="title"type="text"placeholder="请输⼊标题"><br><br>30. 分类: <select id="type">31. <option value="默认"selected>-请选择-</option>32. <option value="美⾷">美⾷</option>33. <option value="代码">代码</option>34. <option value="⽣活">⽣活</option>35. </select>36. <br><br>37. <textarea name=""id="cont"cols="30"rows="10"placeholder="今天想说点啥..."></textarea>38. <div class="send"id="add">添加</div>39. </div>40. <div class="list"id="list">41. 标题: <input id="title1"type="text"placeholder="查询标题"><br><br>42. 分类: <select id="type1">43. <option value="默认"selected>-请选择-</option>44. <option value="美⾷">美⾷</option>45. <option value="代码">代码</option>46. <option value="⽣活">⽣活</option>47. </select>48. <div id="search"class="send">查询</div><br><br>49. <div id="noteList"></div>50. </div>51. </div>52. <script type="template"id="temp">53. <div class="item">54. <div class="title">@title<span>@type: @date</span></div>55. <div class="content">@cont</div>56. </div>57. </script>58. <script>59. $(function(){60. var init = {title:'这是标题',61. date:new Date().toLocaleString(),62. type:'⽰例',63. cont:'这是⼀个笔记应⽤,不需要联⽹,也不需要数据库,可以直接把数据储存在本地.⽅便易⽤!^_^'};64. function show(notes){65. var temp = $('#temp').html();66. var tempStr= '';67. //如果不是数组,变成数组68. if(!Array.isArray(notes)){69. notes = [notes];70. }71. for(var i=notes.length-1;i>-1;i--){72. var note = notes[i];73. tempStr += temp.replace('@title',note.title)74. .replace('@date',note.date)75. .replace('@type',note.type)76. .replace('@cont',note.cont);77. }78. $('#noteList').html(tempStr);79. }80.81. //读取所有数据82. function showList(){83. var notes = localStorage.getItem('notes');84. if(!notes){85. show(init);86. }else{87. notes = JSON.parse(notes);88. show(notes);89. }90. //第⼀个展开91. $('#noteList .item:first').find('.title').trigger('click');92. }93.94. $('#add').click(function(){95. var title = $('#title').val();96. var cont = $('#cont').val();97. var type = $('#type').val();98. if(title == ''){99. alert('标题不能为空!');100. return;101. }102. var data = {title:title,cont:cont,type:type,date:new Date().toLocaleString()}; 103. var notes = localStorage.getItem('notes');104. if(!notes){105. notes = [];106. }else{107. notes = JSON.parse(notes);108. }109. notes.push(data);110. localStorage.setItem('notes',JSON.stringify(notes)); 111. showList();112. });113.114. $('#search').click(function(){115. var title = $('#title1').val();116. var type = $('#type1').val();117. var notes = localStorage.getItem('notes');118. if(!notes){119. alert('没有本地笔记数据!');120. return;121. }else{122. notes = JSON.parse(notes);123. }124. var note = [];125. for(var i=0;i<notes.length;i++){126. //notes[i] json对象127. var flag = false;128. if(!title){129. flag = notes[i].type==type;130. }else if(!type){131. flag = notes[i].title.indexOf(title)>-1;132. }else{133. flag = notes[i].title.indexOf(title)>-1&& notes[i].type==type; 134. }135. if(flag){136. note.push(notes[i]);137. }138. }139. if(note.length == 0){140. alert('抱歉~没有对应的笔记!');141. }else{142. show(note);143. }144. });145.146. $('body').on('click','#noteList .title', function(){147. $(this).next().slideToggle();148. });149.150. showList();151. })152. </script> 153. </body> 154. </html>。

HTML初级知识点总结,最详细的总结

HTML超文本标记语言，一种规范预定义,已经定义好的各种标记，只需要我们把对应的标记放到合适的位置一. HTML基本语法与基本结构(重点）标记的使用1、标记一般成对出现，包含开始标记和结束标记2、标记可以嵌套使用，但是不能交叉使用3、标记不区分大小写属性的使用（属性控制内容的格式,额外的格式）1、书写位置在开始标记中2、格式：属性名=“属性值",多个属性之间使用空格分割3、不同的标记属性可能相同也可能不同4、属性使用的标记中,只能对本标中的内容记产生影响5、属性不冲突时，效果叠加，属性冲突时，就近原则html的基本结构〈html>-—--声明网页〈head〉———-网页的头部信息<title〉标题〈/title〉—---网页的标题</head><body〉—---网页的主体，网页内容主要展示的部分网页的主要内容</body>〈/html〉二. 文本格式的应用1、标题标记<hn>,n的取值1-6,1级标题最大效果:加粗显示，带有自动换行属性:align控制标题的对齐方式，取值left（左对齐，默认值）|center(居中）｜right （右对齐）2、段落标记<p〉效果:把内容分段展示，自动换行属性:align，控制段落内容的对齐方式,取值left（左对齐，默认值）|center（居中）｜right(右对齐）3、换行符〈br /〉，单标记，不需要结束标记，换行但不分段空格符号: 表示一个空格强制换行符：<br /〉4、水平线标记<HR />，单标记效果：水平线,默认是一个粗细为2px（像素）的线条属性：size 控制水平线的粗细，取值为整数，单位为像素（px）width 控制水平线的长度,取值可以是像素单位,也可以是百分数（相对于浏览器窗口百分比)noshade设置水平线不带有阴影，该属性不需要取值color 设置水平线的颜色，取值可以是英文的颜色值，也可以是十六进制的颜色代码align 控制水平线的对齐方式，取值left(左对齐）｜center(居中，默认值）|right(右对齐）5、分节标记<div〉效果：把内容设置为一节，前后带有自动换行属性：align控制div中内容的对齐方式,取值left（左对齐，默认值）｜center（居中）|right（右对齐）6、居中标记符<center>效果：把center标记中的内容居中显示7、文本控制标记<font>效果:控制字体的各种显示样式属性：size 控制字体的大小，取值为绝对值时，1--7，数字越大字体越大，取相对值时,参考的是默认字体（3号），取值在-2-—+4之间color 控制字体的颜色face 控制字体的字体，取值可以是多个值，多个值之间使用逗号分割,取值时从左往右依次取值，找到合适的值为止，假如都不支持，使用默认格式显示8、字体的物理样式加粗：<b>斜体：〈i>下划线:〈u〉删除线：<s〉上标:<sup〉下标：〈sub>1、常用逻辑字符〈ADDRESS〉网页设计者或维护者的信息,通常显示为斜体<CITE> 表示文本属于引用,通常显示为斜体<CODE〉• 表示程序代码,通常显示为固定宽度字体<DFN> • 表示定义了的术语，通常显示为黑体或斜体〈EM> 强调某些字词，通常显示为斜体〈KBD〉表用户的键盘输入,通常显示为固定宽度字体〈SAMP> 表示文本样本,通常显示为固定宽度字体〈STRONG〉特别强调某些字词，通常显示为粗体<VAR> 表示变量，通常显示为斜体2、列表标记1、有序列表,〈ol〉，需要配合〈li>标记使用一个<li>标记对应一个选项ol的属性：type 控制列表的符号样式，取值1|A|a｜i|I，默认是1start 控制列表的起始值，取值为任意的整数li的属性:type控制选项自身的符号样式，取值1|A｜a|i|Ivalue控制选项本身的起始值，取值为任意整数，但是修改自身起始值之后,会对同一个列表中本选项之后的同级<li〉标记产生影响2、无序列表，<ul>，配合<li>标记使用一个<li>标记对应一个选项ul的属性:type 控制所有选项的符号样式，取值disc(实心圆，默认值）｜circle（空心圆）｜square（方块）li的属性：type控制选项本身的符号样式li标记用在ol中，type属性的取值跟ol的type属性取值走，用在ul中，跟着ul的type属性取值走3、定义列表，<dl〉，完成对定义列表的声明<dt>，术语标记，可以理解为类似于列表选项的标题使用〈dd>,描述标记，可以理解为类似于列表的选项使用三. 在网页中使用图片标记：〈img>,单标记，不需要结束标记属性: src 引入图片资源的路径绝对路径：资源在服务器上的位置，该位置是从盘符出发相对路径：资源在服务器上的相对位置，从网页本身出发.。

html标签记忆口诀

html标签记忆口诀
（原创版）
目录
1.标题：html 标签记忆口诀
2.简介：html 标签的重要性和记忆难度
3.解决方案：编写 html 标签记忆口诀
4.示例：html 标签记忆口诀的实例
5.总结：通过口诀记忆 html 标签的优点
正文
HTML 标签是构建网页的基本元素，它能帮助我们创建结构化的网页内容。

然而，HTML 中有许多标签，学习和记忆这些标签往往让人感到头疼。

为了解决这个问题，我们可以编写一些记忆口诀，帮助我们快速掌握常用的 HTML 标签。

首先，让我们来看一个简单的 HTML 标签记忆口诀实例：
一、标题标签
【提要】：标题标签，重要内容，加粗显示
【口诀】：标题内容重要，加粗引人注目
二、段落标签
【提要】：段落标签，文本组织，清晰易读
【口诀】：段落分明，阅读更舒适
三、列表标签
【提要】：列表标签，条理清晰，项目罗列
【口诀】：列表有序，内容条理分明
四、链接标签
【提要】：链接标签，网页跳转，资源导入
【口诀】：链接跳转，方便快捷
通过这些口诀，我们可以轻松地记住一些常用的 HTML 标签及其功能。

此外，我们还可以根据自己的需求，编写更多的口诀来记忆更多的标签。

这样，我们在编写网页时，就能更熟练地运用 HTML 标签，提高工作效率。

总之，编写 HTML 标签记忆口诀是一种有效的学习方法，可以帮助我们快速掌握 HTML 标签，提高网页编写能力。

最全Html代码大全,学习必备资料

最全Html代码⼤全,学习必备资料⼀、⽂字1.标题⽂字 <h#>..........</h#> #=1~6；h1为最⼤字，h6为最⼩字2.字体变化 <font>..........</font>【1】字体⼤⼩ <font size=#>..........</font> #=1~7；数字愈⼤字也愈⼤【2】指定字型 <font face="字体名称">..........</font>【3】⽂字颜⾊ <font color=#rrggbb>..........</font>rr：表红⾊（red）⾊码gg：表绿⾊（green）⾊码bb：表蓝⾊（blue）⾊码rrggbb也可⽤6位颜⾊代码数字3.显⽰⼩字体 <small>..........</small>4.显⽰⼤字体 <big>..........</big>5.粗体字 <b>..........</b>6.斜体字 <i>..........</i>7.打字机字体 <tt>..........</tt>8.底线 <u>..........</u>9.删除线 <strike>..........</strike>10.下标字 <sub>..........</sub>11.上标字 <sup>..........</sup>12.⽂字闪烁效果 <blink>..........</blink>13.换⾏（也称回车） <br>14.分段 <p>15.⽂字的对齐⽅向 <p align="#"> #号可为 left：表向左对齐（预设值） center：表向中对齐 right：表向右对齐 P.S.<p align="#">之后的⽂字都会以所设的对齐⽅式显⽰，直到出现另⼀个<p align="#">改变其对齐⽅向，遇到<hr>或<h#>标签时会⾃动设回预设的向左对齐。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

Html手写代码笔记
<html> 代表网页
<html>网页开始的起点</html>网页结束点的注意/ 结束时的写法
<head>代表头部首要显示的东西
<head>开始显示的起点</head>结束开始的显示的点
<title>标题
<title>标题开始</title>标题结束一般首要显示的是标题，代码如下表示：<head>
<title>北京楚曼教育科技有限公司</title>
</hend>
<body> 表示身体部位
<body> 身体显示的内容开始点</body> 身体显示的内容结束点
<body>标签属性有：
<body bgcolor=“背景色”background=“背景图”text=“没有连接的文本字体颜
色bgproperties=“fixed”可设置，鼠标向下滚动时，文字向上移动，背景不动> <br> 表示换行
<br>如同页面里的换行键，一个<br> 一次空格，两个<br> 两次空格
<p>表示段略（换行）
<p>段落开始起点，</p>段略结束点
<p>标签的属性有
<p aling=“center”居中对齐aling=“right”右对齐aline=“left”左对齐>
<b>标签表示粗体（字）<i>标签表示斜体<u>表示字体下划线
<b>字体开始加粗的起点</b>字体加粗结束点
<i>字体开始变斜的起点</i>字体变斜结束点
<u>字体开始下划线的起点</u>字体下划线结束点
例子：<body 里面设置属性改变整个也变的属性>
<p 设置属性> <b> <i> <u> 刘占青</u> </i> </b> </p>
</body>
<hr>标签代表横线又开始无结束
<br>线条属性有
<br size=“数字”线条的粗细width=“X%或X”长短百分比或几color=“颜色”
线条的颜色noshade=“noshade”去掉线条立体感align=“left/right/center”左右居
中对齐>
<center>表示居中标签
<center> 居中文本开始点</center>居中文本结束点
<pre>标签表示
pre 元素可定义预格式化的文本。

被包围在pre 元素中的文本通常会保留空格和换行符。

而文本也会呈现为等宽字体。

<strong>标签加重，加强
<strong> 标签和<em> 标签一样，用于强调文本，但它强调的程度更强一些。

浏览器通常会以不同于<em> 标签的方式来显示<strong> 标签中的内容，通常是用加粗的字体（相对于斜体）来显示其中的内容，这样用户就可以把这两个标签区分开来了。

如果常识告诉我们应该较少使用<em> 标签的话，那么<strong> 标签出现的次数应该更少。

如果说用<em> 标签修饰的文本好像是在大声呼喊，那么用<strong> 标签修饰的文本就无异于尖叫了。

沉默寡言的人说出的话总是一诺千金，与此相同，限制<strong> 的使用可以令应该更加引人注意，而且更加有效。

<strong>开始加重文本的点</strong>结束加重文本的点
<em>和<var>和< cite>和<dfn>标签表示斜体
<em>开始加重倾斜文本的点</em>结束倾斜文本的点
<var>开始加重倾斜文本的点</var>结束倾斜文本的点
<cite>开始加重倾斜文本的点</cite>结束倾斜文本的点
<dfnr>开始加重倾斜文本的点</dfn>结束倾斜文本的点
<address>标签表示斜体并换行
<address>开始斜体并换行的点</address>结束斜体并换行的点
<strike>标签删除线
<strike>开始文本上删除线点</strike>结束文本上删除线的点
<big>标签加大放大
<big>开始文本要加大的地方</big>结束文本要加大的地方
<small>标签减小缩小
<small>开始文本要缩小的地方</small>结束文本要缩小的地方
<sub>标签表示下标签
<sub>开始文本要下标的地方</sub>结束文本要下标的地方
<sup>标签表示上标签
<sup>开始文本要下标的地方</sup>结束文本要下标的地方
<h1> <h2> <h3> <h4> <h5> <h6> 标题标签从大到下<h1> 最大<h6>最小<h1>开始标题的地方</h1>结束标题的地方
标题标签是独立的一行
<font>标签是设置文本里的字体字号及颜色
<font>开始字体变化的地方</font>结束字体变化的地方
<font>属性有：
<font color=“字体颜色”size=“字体大小”face=“字体名字”>
<ol> 标签定义有序列表，按数字排序显示
<ol>有序列表开始的地方</ol>有序列表结束的地方
<ol>有序排列属性有：
<ol type=“I/a/A/i/1”排序列表（如果不用type标签值，默认排序为1、2、3、）start=“几”列表排序从几开始>
<li> 标签定义列表项目。

标签可用在有序列表 (<ol>) 和无序列表 (<ul>) 中
<li>标签属性：
<li type=“I/a/A/i/1”排序列表（用type标签值，那个设置的项就是几）设置start=“几”列表排序，那么没有设置的项目就从几加上设置的项目开始排序使用value=“几”表示当前项目的值，会出现几开始排序，如最后的图案>
<ol>
<li>咖啡</li>
<li>茶</li>
<li>牛奶</li>
</ol>
注意:
<ul>表示无序排列，排序没有I/a/A/i/1等标符
<ul>无序列表开始的地方</ul>无序列表结束的地方
<ul>属性有:
<ul type=“circle”表示小方块type=“disc”表示小圆点type=“square”表示空心圆如图
<menu>表示无序清单<dir>表示作用和用法、属性和<ul>标签完全相同
网页布局之表格标记
<Table>是表格，是容器标记，<tr>行，<td>行里的格,全被table包含着基本包含如下：
<table 属性>
<tr>
<td 属性> </td>
</tr>
</table>
绘制table-表格
<table width=“多宽”height=“多高”border=“表格边框的厚度”bordercolor=“边框颜色”align=“center居中对齐，left左对齐（不设置align时默认左对齐），right右对
齐cellspacing=“单元格的间距”cellpadding=“单元格里的文字与单元格边框的距
离”bgcolor=“单元格背景色”>
<tr> <td width=“多宽”height=“多高”valign=“top顶端对齐，middle 居中对齐（不设置valign参数时默认居中对齐），bottom底端对齐”bgcolor=“本单元格背景色”
background=“单元格背景图片”colspan行=“几”表示一个行单元格占几个行单元格的位置，像合并单元格，合并几个就对其到几个，rowspan列=“几”>这是第一个单元格</td></tr>
</table>
注意：align表示表格的对齐方式，valign表示行里的文字对齐设置
＜img＞插入图片
<img src=“制定图片的位置”width=“设置宽度”height=“设置高度”valign=“top 对内容进行上对齐。

middle 对内容进行居中对齐（默认值）。

bottom 对内容进行下对齐。

baseline 与基线对齐。

”。