html初级入门01
一般先学习HTML+CSS， 这里我们先定一个小目标，先学HTML,后学习CSS。
HTML（英文Hyper Text Markup Language的缩写）中文译为“超文本标签语言”。是用来描述网页的一种语言。
所谓超文本，因为它可以加入图片、声音、动画、多媒体等内容，不仅如此，它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接。
1、 HTML骨架结构
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
</body>
</html><!DOCTYPE html>用的哪个版本的代码
<head></head>:声明--给浏览器看的
<meta charset="UTF-8" />代码的编码方式 ：utf8,不加会乱码
<meta name="Keywords" content="银河学院" />keywords关键字
<meta name="Description" content="银河学院" />Description网页描述
<link rel="stylesheet" href="css/1.css" />
<link rel="shortcut icon" href="***.ico" />link引入外部文件：css ison2、标签
（1）标题文本： h1、h2、h3、h4、h5、h6
（2）段落标签：p
（3）水平线标签：<hr/> <hr/>是单标签
（4）换行标签：<br/> <br/>是单标签
（5）文本格式化标签：（ b i s u 只有使用 没有 强调的意思 strong em del ins 语义更强烈）
（6）图像标签img：
（7）链接标签：<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
注意：
1.外部链接 需要添加 http:// www.baidu.com
2.内部链接 直接链接内部页面名称即可 比如 < a href="index.html"> 首页 </a >
3.如果当时没有确定链接目标时，通常将链接标签的href属性值定义为“#”(即href=”#”)，表示该链接暂时为一个空链接。
4.不仅可以创建文本超链接，在网页中各种网页元素，如图像、表格、音频、视频等都可以添加超链接。
（8）锚点定位
“链接文本"创建链接文本（被点击的）"> <a href="#two">
使用相应的id名标注跳转目标的位置。
<h3 id="two">第2集</h3>**（9）base 标签 **base 可以设置整体链接的打开状态 ，base 写到 之间，把所有的连接 都默认添加 target=”_blank”
<base target="_blank">（10）特殊字符标签:
(11)注释标签： ctrl + / 或者 ctrl +shift + /
3、路径(重点、难点)
路径可以分为： 相对路径和绝对路径
相对路径
以引用文件之网页所在位置为参考基础，而建立出的目录路径。因此，当保存于不同目录的网页引用同一个文件时，所使用的路径将不相同，故称之为相对路径。
1. 图像文件和HTML文件位于同一文件夹：只需输入图像文件的名称即可，如img src=”logo.gif” /。
2. 图像文件位于HTML文件的下一级文件夹：输入文件夹名和文件名，之间用“/”隔开，如img src=”img/img01/logo.gif” /。
3. 图像文件位于HTML文件的上一级文件夹：在文件名之前加入“../” ，如果是上两级，则需要使用 “../ ../”，以此类推，如img src=”../logo.gif” /。
绝对路径
绝对路径以Web站点根目录为参考基础的目录路径。之所以称为绝对，意指当所有网页引用同一个文件时，所使用的路径都是一样的
“D:\web\img\logo.gif”，或完整的网络地址例如“http://www.itcast.cn/images/logo.gif”。
4、列表标签
（1）无序列表< ul><li></li></ul>
（2）有序列表< ol><li></li></ol>
（3）自定义列表<dl><dt></dt><dd></dd></dl>
（4）表格 table
<table border="" cellspacing="" cellpadding="">
<tr><th>Header</th></tr>
<tr><td>Data</td></tr>
</table>表格标题 <caption>我是表格标题</caption>
合并单元格:跨行合并：rowspan 跨列合并：colspan
表单
input控件
常用属性：
1. Action在表单收集到信息后，需要将信息传递给服务器进行处理，action属性用于指定接收并处理表单数据的服务器程序的url地址。
2. method用于设置表单数据的提交方式，其取值为get或post。
3. name用于指定表单的名称，以区分同一个页面中的多个表单。
<form action="url地址" method="提交方式" name="表单名称">
<br />
文本框<input type="text"/>
<br />
密码框<input type="password" />
<br />
按钮
<input type="button" value="按钮" />
<br />
多选框 1
<input type="checkbox" /> 2
<input type="checkbox" /> 3
<input type="checkbox" /> 4
<input type="checkbox" />
<br />
单选框(同一组单选框，同时只有一个被选中) 1
<input type="radio" name="a" /> 2
<input type="radio" name="a" /> 3
<input type="radio" name="a" /> 4
<input type="radio" name="a" />
<br />
本地选择文件
<input type="file" />
<br />
重置表单
<input type="reset" />
<br />
下拉菜单
<select name="">
<option value="">1</option>
<option value="">2</option>
</select>
<br />
多行文本框
<textarea cols="每行中的字符数" rows="显示的行数">文本内容
</textarea>
<!--h5新表单-->
<br /><input type="number" /><!--必须输入数字-->
<br /><input type="color" /><!--可以选颜色-->
<br /><input type="tel" />
<input type="submito" />
</form>