html，Hypertext Markup Language，超文本，标记，语言
html的基本标签
HTML 元素指的是从开始标签到结束标签的所有代码；属性赋予元素意义和语境；
1、<!DOCTYPE>元素作用的是，该元素用来声明命名空间，该元素用来向搜索引擎声明网站关键字、网站作者；
2、为了标识一个 HTML 文件，应该使用的标签，<html> </html>；
3、文档首部标记，head；
4、<meta>标签，表示网页元数据，是提供给浏览器和搜索引擎的关于网页的描述性数据；
html源文件保存的时候，选择的保存方式，要与<meta charset="UTF-8" />里的charset属性一致，否则会出现乱码
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
//我们常见的Unicode码是utf-8
5、标题标记，title；
6、文档内容标记，body；
7、标题，h1~h6，一个页面建议只用一个h1标签；
8、段落，p；
9、段内换行，br，是单独出现的标签 <br />；
10、空格字符 ，以 & 开始 ; 结束；
11、预留格式，pre，会保留源格式，包括空格；
12、段内分组，span，在段落内，把需要特殊表现出来的文字放在<span> </span>标签对之间就可以了；
13、水平线，hr，是单独出现的<hr />；
14、注释 <!-- 注释 -->，是可以跨行的，可以另起一行；
15、超链接，文字超链接，图片超链接，导航栏，a标签，是成对出现的，以<a>开始， </a>结束；
<a href="http://www.baidu.com"> 百度 </a>
a标签的13个属性
Common -- 一般属性
accesskey -- 代表一个链接的快捷键访问方式
charset -- 指定了链接到的页面所使用的编码方式,比如UTF-8
coords -- 使用图像地图的时候可以使用此属性定义链接的区域,通常是使用x,y坐标
href -- 代表一个链接源(就是链接到什么地方)
hreflang -- 指出了链接到的页面所使用的语言编码
rel -- 代表文档与链内接到的内容(href所指的内容)的关系
rev -- 代表文档与链接到的内容(href所指的内容)的关系
shape -- 使用图像地图的时候可以使用shape指定链接区域
tabindex -- 代表使用"tab"键,遍历链接的顺序
target -- 用来指出哪个窗口或框架应该被此链接打容开
title -- 代表链接的附加提示信息
type -- 代表链接的MIME类型
16、分区，div标签，division；
div标签的align属性，可以把内嵌的<table></table>标签居中
<div align="center">
This is some text!
</div>
<div align="value">
align属性值
left 左对齐内容。
right 右对齐内容。
center 居中对齐内容。
justify 对行进行伸展，这样每行都可以有相等的长度(就像在报纸和杂志中)。
17、<table> 标签定义 HTML 表格；
简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成，tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元，td属性，如，colspan="3"，rowspan="3"，可以合并单元格
<table border="1">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
18、<canvas> 标签，只是个容器，js 绘图
<!DOCTYPE html>
<html>
<body>
<!-- canvas标签 是个容器 自此区域内 js绘图 -->
<canvas id="myCanvas" width="950" height="150" style="border:0px solid black; background: #FFEBCD;"> <!-- 标签属性 -->
Your browser does not support the HTML5 canvas tag.</canvas>
<!-- 导入js -->
<script src="js/myjs.js"></script>
</body>
</html>
// id查找标签
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");//方法返回一个用于在画布上绘图的环境
ctx.shadowBlur=30; //设置或返回用于阴影的模糊级别
ctx.fillStyle="blue";//设置或返回用于填充绘画的颜色、渐变或模式
ctx.shadowColor="black";//设置或返回用于阴影的颜色
ctx.fillRect(45,45,50,50); //绘制“被填充”的矩形
ctx.fillStyle="#6495ED";//设置或返回用于填充绘画的颜色、渐变或模式
ctx.font="60px Verdana";
ctx.shadowColor="#ADFF2F";
ctx.fillText("Hello World!",250,90);//在画布上绘制“被填充的”文本
19、<ul>、<ol>、<dl>、<dt>、<dd>、<li>标签，列表，三种类型，有序列表、无序列表和自定义列表，表现为文字或图片列表等；
20、<form>、<input>、<textarea>、<slect>、<option>标签，表单，所有表单控件(文本框、文本域、按钮、单选框等)都必须放在<form></form>标签之间，单选框 name属性要一致；
<form method="post" action="save.php">
</form>
<input type="submit" name="botton" value="提交" />
<textarea cols="50" rows="10">在这里输入内容...</textarea>
<select name="select">
<option value="看书" selected="selected">看书</option>
</select>
21、<frameset>标签，框架，不能将<body></body>标签与<frameset></frameset>标签同时使用；设置框架尺寸是不可以调整的<frameset src="example_a.html" noresize="noresize" />；若一个有 3 个框架的 Web 页实际上有 4 个独立的HTML文件；
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />
<frame src="frame_c.htm" />
</frameset>
</html>
22、<iframe> 标签，可以把需要的文本放置在 <iframe> 和 </iframe> 之间，这样就可以应对无法理解 iframe 的浏览器；
<html>
<body>
<iframe src ="/index.html" width="400" height="300" frameborder="0">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
23、<marquee>标签，不是w3c官方定义，但是用途很广，俗称跑马灯，几乎所有元素都可以滚动，文字、图片、画布等；常用属性:loop、direction、scrolldelay、scrollmount、behavior(scroll，slide，alternate)、width、height、bgcolor；
<marquee behavior="alternate" direction="left">滚动文本</marquee>
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="50" scrolldelay="1000" behavior="slide" loop="1"></marquee>
前端url，href，src详细含义，https://www.cnblogs.com/Sarah119/p/8637387.html
url，统一资源定位器，Uniform Resource Locator，网页地址，绝对url，基url(base标记，可以设置)，相对url(相对的含义是相对目录)；
href，Hypertext Reference，超文本链接，网络资源位置；
src，source，资源，外部资源位置；
扫一扫
9万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
