HTML基础
2019-02-26 本文已影响0人
penpy
HTML概述
HTML：超文本标记语言
标签：由尖括号组成，比如<title>，通常是成对出现，特殊的单独出现：<img />
元素：开始标签+内容+结束标签,例如<title>百度一下，你就知道</title>
标签嵌套：<html><body><body><html>
标签嵌套
属性：
标签属性
属性之间的先后顺序无关
HTML文件结构
文件结构：
HTML文件结构
HTML编辑器
HTML5标准的文件结构
元数据：作者信息，网页修改信息以及网页的关键字信息等基本信息
字符与编码：
字符集与编码
编码方式
乱码
HTML标签
标题h1~h6:一到六级标题，建议只有一个h1
标题
这是浏览器默认的文字样式，在CSS阶段可以再修改。
段落p：<p></p>会换行和自动添加段落间距，但是源文件中的连续空格和空行在浏览器中只会显示一个空格。
段落内容
段内换行br：单独出现的标签<br />
段内换行
空格字符 ；：（特殊字符要求全小写）添加多个空格
空格符号
添加了两个段内换行符号，浏览器显示了一个空行。
预留格式pre：源文件和浏览器的显示是一样的，源文件中的空格和换行符会被保留。
预留格式
行内组合span：针对需要特殊表示的文字，组合行内元素，以便通过CSS样式来格式化。
行内组合
水平线hr：添加水平线，水平线标签也是单独出现的。
水平线
注释：向源文件添加注释。
注释
超链接a：
超链接
跳转到本站的其他网页是只需要将该网页的文件名赋值给href就行，若是跳转到其他站点就赋值url。
使用超链接时要在里面使用段落标签p，超链接不会自动分段
图像img：图像有JPG、GIF和PNG三种格式。
1.JPG：有损压缩，色彩丰富图片。
2.GIF：简单动画，背景透明
3.PNG：支持无损压缩/有损，透明，交错（从概貌到全貌），动画，比起GIF颜色更加丰富。
插入图像
src属性表示的是图片的相对路径。
图片在上一个文件夹时的相对路径
在浏览器因为某些原因没有打开图片时浏览器会找到alt属性，将其表示的图片的替换文本显示出来。
div标签，表格table标签，有序列表ol标签，无序列表ul标签：
排行
排行滴源文件
表单和表单元素：
表单
表单：是余个用来采集用户信息的区域。
表单元素：文本框、按钮、单选、复选、下拉列表、文本域。
表单标签form
action属性表示收集来的数据交给哪个页面来处理
input——文本框、密码框
文本框和密码框的实现
表单元素没有自动换行的效果。
name属性：在处理数据时告诉后端这个数据来自于哪个表单元素。
input——提交按钮
input——重置按钮
input——单选框和复选框
单选框、复选框案例
单选框的每个选项的name取值必须是一致的。
下拉列表框
文本域
文本域案例
