01-HTML学习笔记

一.HTML简介

　　HTML 是用来描述网页的一种语言。

- 　　HTML 指的是超文本标记语言 (Hyper Text Markup Language)
- 　　HTML 不是一种编程语言，而是一种标记语言 (markup language)
- 　　标记语言是一套标记标签 (markup tag)
- 　　HTML 使用标记标签来描述网页(HTML所有的操作都是通过标记实现的，标记即标签)

　　HTML规范：

- 　　开始标签和结束标签<html>...</html>
- 　　头标签和正文标签：<head>设置相关头文件信息</head>,<body>页面正文内容</body>
- 　　html代码不区分大小写
- 　　部分标签没有结束标签：<br/>,<hr/>......

　　HTML的操作思想：

　　使用标签把要操作的数据包起来(封装)，通过修改标签的属性值实现标签内数据样式的变化。

　　一个标签相当于一个容器，想要修改容器内数据的样式，只需要修改容器的属性值，就可以实现样式的变化。

　　HTML文档 = 网页，Web浏览器的作用就是用来读取HTML文档，并以网页的形式显示出他们。

二.HTML常用标签

　　1.标题标签

　　　　标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。<h1> 定义最大的标题。<h6> 定义最小的标题。

　　2.水平线标签

　　　　<hr /> 标签在 HTML 页面中创建水平线，主要用于分隔内容。

　　3.注释标签

　　4.段落标签

　　　　段落是通过 <p> 标签定义的。

　　5.换行标签

　　　　<br /> 元素是一个空的 HTML 元素。由于关闭标签没有任何意义，因此它没有结束标签。

　　6.样式标签

　　　　<font>定义字体，<s>定义删除线，<b>定义粗体，<u>定义下划线，<i>定义斜体，<sup>上标字，<sub>下标字，<em>着重文字，<ins>插入字

　　　　<pre>原样输出，<code>定义计算机代码，<var>定义计算机变量，<abbr>定义缩写，<bdo>定义文字方向，<q>定义短的引用语

　　　　常用属性：align对齐方式，background设置背景颜色

　　7.链接标签

　　　　<a href="url">Link text</a>，target属性定义新页面打开的方式(blank新开页面，self当前页面打开)

　　8.图像标签

　　　　<img src="url" />，<img> 是空标签，意思是说，它只包含属性，并且没有闭合标签。

　　　　alt 属性用来为图像定义一串预备的可替换的文本，即当鼠标放在图片上时，悬停显示的内容。

　　9.表格标签

　　　　表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。

　　　　<caption>表格标题，<thead>表格页眉，<tfoot>表格页脚，<tbody>表格主体，<rowspan>跨行合并，<colspan>跨列合并。

<table border="1">
<tr>
 <td>row 1, cell 1</td>
 <td>row 1, cell 2</td>
</tr>
<tr>
 <td>row 2, cell 1</td>
 <td>row 2, cell 2</td>
</tr>
</table>

　　10.列表标签

　　　　无序列表始于 <ul> 标签，每个列表项始于 <li>。此列项目使用粗体圆点（典型的小黑圆圈）进行标记。

　　　　有序列表始于 <ol> 标签，每个列表项始于 <li> 标签。

　　　　自定义列表以 <dl> 标签开始，每个自定义列表项以 <dt> 开始，每个自定义列表项的定义以 <dd> 开始。

　　11.块元素标签

　　　　<div> 元素是块级元素，常见的用途是文档布局，它取代了使用<table>表格定义布局的老式方法。

　　　　<span> 元素是内联元素，可用作文本的容器，为部分文本设置样式属性。

　　12.头标签

　　　　<head> 元素是所有头部元素的容器。<head> 内的元素可包含脚本，指示浏览器在何处可以找到样式表，提供元信息，等等。
　　　　<head>容器包含以下标签：

　　　　<title> 标签定义文档的标题。

　　　　<base> 标签为页面上的所有链接规定默认地址或默认目标（target）

　　　　<meta> 标签提供关于 HTML 文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。(meta 元素被用于规定页面的描述、关键词、文档的作者、最后修改时间以及其他元数据。)

　　　　<style> 标签用于为 HTML 文档定义样式信息。

　　　　<script> 标签用于定义客户端脚本。

三.表单标签

　　　　HTML 表单用于搜集不同类型的用户输入，表单标签是最重要的标签，所以单独列出来。

　　　　<form> 定义 HTML 表单，其中包含的部分称作表单元素，表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮等等。

　　　　1.表单元素。

- - 　<input> 元素是最重要的表单元素。

　　　　　　　　　　　　<input> 元素根据不同的 type 属性，可以变化为多种形态，type属性：text,password,radio,checkbox,file,submit,reset,button,image,number等等。
　　　　　　　　　　　　text(普通文本输入项)，password(密码输入项)，radio(单选输入项)，checkbox(多选输入项)，file(文件上传输入项)，submit(提交按钮)，reset(重置按钮).
　　　　　　　　　　　　输入限制：disabled，max，min，maxlength，pattern，readonly，required，size，step，value。
　　　　　　　　　　　　输入类型：date,color,range,month,week,time,datetime,datetime-local,email,search,tel,url.

- - 　<select>元素
    　　下拉列表元素，<option>定义下拉列表中待选择的选项。
  - 　<textarea>元素
    　　定义多行输入字段(文本域)。
  - <button>元素
    　　定义可点击的按钮。

　　　　2.表单属性。

- - 　Action属性
    　　定义提交表单时要执行的操作，默认提交到当前的页面，也可以指定页面。
  - 　Target属性
    　　规定提交表单后在何处显示响应，默认在当前窗口打开。
  - 　Method属性
    　　指定提交表单数据时要使用的 HTTP 方法(get会以名称/值对的形式显示所有参数在URL地址中，post不显示)，默认为get。
    　　get安全级别低，且请求数据大小有限制，post安全级别高且没有大小限制。
  - 　Autocomplete属性
    规定表单是否应打开自动完成功能。(根据之前的输入内容自动填写)
  - 　Novalidate属性
    　　是一个布尔属性，它规定提交时不应验证表单数据。
  - 　Enctype属性
    　　规定将表单数据提交到服务器时应如何编码。

四.框架标签

　　　　通过使用框架，你可以在同一个浏览器窗口中显示不只一个页面。每份HTML文档称为一个框架，并且每个框架都独立于其他的框架。

　　　　<frameset>标签定义如何将窗口分割为框架，每个<frameset>定义了一系列行和列，而rows/columns 的值规定了每行或每列占据屏幕的面积。

　　　　<frame>标签则定义了放置在每个框架中的 HTML 文档，即具体显示的页面。

<!--按行划分,第一行高度占80，其余是给剩下的行-->
<frameset rows="80,*">
　　<frame src="frame_a.html">
　　<frame src="frame_b.html">
</frameset>
<!--按列划分,左边的列占据了浏览器25%的宽度，右边的列占据剩余的75%宽度-->
<frameset cols="25%,75%">
   <frame src="frame_c.html">
   <frame src="frame_d.html">
</frameset>

　　　　注：

　　　　　　1.有些框架有可见边框，并可以拖动边框来改变大小，如果要避免这种情况发生，可在<framese>标签中加入：noresize="noresize"。

　　　　　　2.为不支持框架的浏览器添加<noframes> 标签。

　　　　　　3.不能将<body></body>标签与<frameset></frameset>标签同时使用。

posted @ 2021-06-16 10:33 benon 阅读(74) 评论(0) 编辑收藏举报

刷新页面返回顶部

benon

01-HTML学习笔记

公告