html

概念:HTML(英文Hyper Text Markup Language的缩写)中文译为“超文本标签语言”,主要是通过HTML标签对网页中的文本、图片、声音等内容进行描述。

格式

HTML有自己的语法格式约定:

<HTML>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
//TODO...
</body>
</HTML>
  • <html> 标签: 代表当前书写的是一个HTML文档
  • <head>标签:存储的本页面的一些重要的信息,它不会显示
  • <head>标签:有一个子标签<title>它是用于定义页面的标题的
  • <body>标签:书写的内容会显示出来

分类

在HTML页面中,带有“< >”符号的元素被称为HTML标签,如上面提到的 HTML、head、body都是HTML标签。所谓标签就是放在“< >” 标签符中表示某个功能的编码命令,也称为HTML标签或 HTML元素。

双标签

<body>文字</body>

单标签

<br/>

标签关系

标签关系就分为两种:并列关系嵌套关系

并列关系

<head></head>
<body></body>

嵌套关系

<head><title></title></head>

常见标签样式

换行标签

<br/>

段落标签

<p></p>

水平线标签

<hr></hr>

行内标签

<span></span>

块标签

<div></div>

字体标签

<font></font>

标题标记标签

<h1>
<h2>
<h3>
<h4>
<h5>
<h6>

标题标签中h1最大h6最小,会自动换行,会字体加粗,还会有一定距离

无序列表标签

<ul></ul>

有序列表标签

<ol></ol>

图像标签

<img></img>
  • src:代表图片路径
  • width和height分别代表宽高
  • alt:如果图片不显示,默认显示文本信息
  • title:鼠标悬停时,显示文本信息
  • align:图片附件文字对齐方式

超链接标签

<a></a>
  • href:代表跳转路径
  • target:规定在何处打开这个链接文档。blank表示新窗口,self为当前窗口

表格标签

<table></table>
//表格中的行
<tr></tr>
//表格中的单元格
<td></td>

表单标签

<form></form>
  • action:整个表单提交的目的地
  • method:表单提交的方式。get或者post

表单中的元素标签

//用于搜集用户信息,根据type属性值的不同,样式不同
<input></input>

//下拉列表
<select></select>

//文本域
<textarea></textarea>
  • text:默认值,文本输入框
  • password:密码样式
  • checkbox:复选框
  • radio:单选
  • file:文件上传
  • reset:重置按钮
  • submit:提交按钮
  • button:普通按钮

框架标签

<frameset></frameset>

注意:框架标签和body标签不能共存