认识HTML

认识HTML

认识网页

	主要由文字、图像和超链接等元素构成

代码开发工具

	Dreamweaver、SublimeText、WebStorm、HBuilder、vScode

HTML骨架标签

	HTML标签：页面中最大的标签，根标签
		双标签、单标签
		标签关系：嵌套关系(父子)、并列关系(兄弟)
	头部：注意再head标签中我们必须要设置的标签是title
	标题：让页面拥有一个属于自己的网页标题
	主体：元素包含文档的所有内容，页面内容，基本都是放到body里面的

HTML初识

	HTML：超文本标记语言是用来描述网页的一种语言。
页面语言/字符集
	lang="en" 指定html 语言种类      	   en定义语言为英语 zh-CN定义语言为中文
	UTF-8:基本包含全世界所有国家需要用到的字符	       	         GBK：包含全部中文字符 是GB2312的扩展，加入对繁体字的支持，兼容GB2321       			                                                       BLG5：包含

HTML常用标签

	标题标签：h1~h6
	段落标签：p
	水平线标签：hr
	换行标签：br
	div和span标签
	标签属性
		img图像标签
		a 链接标签
	注释标签
		<!---->
		/**/

路径

	相对路径
	绝对路径

浏览器

• 网页的显示、运行的平台
• 常用浏览器IE、火狐、谷歌、Sarari、Opera等
• 内核：IE：Trident 火狐：Gecko
  谷歌：Chromium/Blink
  Sarari:webkit Opera:blink

Web标准(重点)

	Web标准不是某一个标准，而是由W3C组织和其他标准化组织制定的一系列标准的集合
	Web标准的好处：1.让Web的发展前景更广阔。2.内容能被更广泛的设备访问。3.更容易被搜寻引擎搜索。4.降低网站流量费用。5.使网站更易于维护。6.提高页面浏览速度。
	Web标准构成：结构、表现、行为三方面。

表格

	表格的主要目的就是用来显示特殊数据的
	**构成**
		table 用于定义一个表格标签
		tr 标签 用于定义表格的行，必须嵌套在table标签中
		td 标签 用于定义表格中的单元格，必须嵌套在标签中
	**表格属性**
		border： 设置表格的边框
		cellspacing ：设置单元格与单元格之间的空白间距
		cellpadding：设置单元格内容与单元格边框之间的空白间距
		width： 设置表格的宽度
		height ：设置表格的高度
		align  ：设置表格在网页中的水平对齐方式
		th ：表头  一般在单元格位于表格的第一行或者第一列，并且文本加粗居中
		**caption 标题** 通常标题会被居中且显示于表格上，此标签紧随table标签之后。此标签只存在表格中才有意义

合并单元格(难点)

		跨行合并：rowspan="合并单元格的个数"
		跨列合并：colspan="合并单元格的个数"
		合并的顺序  先上后下  先左后右
		注意：
			1.用于定义表格的头部。用来放标签标题之类的东西。内部必须拥有标签
			2.用于定义表格的主体。放数据本体
			3.放表格的脚注之类
			4.以上标签都是放在table标签中

列表

	概念：容器的里面装载的结构，样式一致的文字或图表的一种形式，叫列表
	特点：整齐、整洁、有序，跟表格类似，但是他可组合自由度更高
	无须列表  ul
		无须列表项之间没有顺序级别之分，是并列的。
		格式： <ul>
		               <li>列表1</li>
		                <li>列表2</li>
		            </ul>
	有序列表  ol
		有序列表即为有排列顺序的列表，其各个列表项按照一定的顺序排列定义,
		格式： <ol>
		               <li>列表1</li>
		               <li>列表2</li>
		            </ol>
	自定义列表
		格式：<dl>
		                <dt>名词1</dt>
		                <dd>名词1解释1</dd>.
		                <dt>名词2</dt>
		                <dd>名词2解释2</dd>
		           </dl>

表单标签

	表单目的是为了收集用户信息。
	表单控件：包含了具体的表单功能项，如单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。
	input控件
		  input输入的意思
		  <input/>标签为单标签
		  type属性设置不同的属性值用来指定不同的控件类型
		  除了type属性还有别的属性

type 表单类型

label标签

		目标
			label标签主要目的是为了提高用户体验。为用户提高最优秀的服务。
		概念
			label标签为input元素定义标注（标签)。
		作用
			用于绑定一个表单元素,当点击label标签的时候,被绑定的表单元素就会获得输入焦点。