HTML最全面总结

这篇博客全面总结了HTML的基本结构、文本格式化、链接、图像、表格、列表、区块、表单、框架、脚本和字符实体等核心概念,详细介绍了各个元素的语法和用途,是学习HTML不可或缺的参考资料。
摘要由CSDN通过智能技术生成

html

标题

<h1> - <h6>

段落

<p>

折行

<br>

注释

<!--...-->

水平线

<hr>

1.1 结构

声明HTML文档 !DOCTYPE html
定义html文档 html
定义文档头部 head
描述元数据 meta
定义文档标题 title
定义所有链接url base
内联样式表 style
外部样式表 link
脚本文件 script
定义可见页面内容 body

1.2 文本格式化

粗体文本

<b>

加重语气

<strong>

斜体字

<i>

着重文字

<em>

小号字

<small>

下标字

<sub>

上标字

<sup>

插入字

<ins>

删除字

<del>

计算机代码

<code>

键盘码

<kbd>

计算机代码

<code>

计算机代码

<samp>

变量

<var>

预格式文本

<pre>

缩写

<abbr>

地址

<address>

文字方向

<bdo>

长的引用

<blockquote>

短的引用语

<q>

引用、引证

<cite>

定义项目

<dfn>

1.3 链接

一、简介
点击这些内容来跳转到新的文档或者当前文档中的某个部分。
二、超文本链接

标签<a>中使用了href属性来描述链接的地址。
  1. 一个未访问过的链接显示为蓝色字体并带有下划线。
  2. 访问过的链接显示为紫色并带有下划线。
  3. 点击链接时,链接显示为红色并带有下划线。

三、链接语法

<a href="url">链接文本</a>

“链接文本” 不必一定是文本,图片或其他 HTML 元素都可以成为链接。
四、ID属性
创建在一个HTML文档书签标记。

1.4 图像

一、简介
使用源属性(src), src指"source"源属性的值是图像的 URL 地址。
二、图像的语法

<img src="url" alt="some_text">

三、图像alt属性
为图像定义一串预备的可替换的文本。
四、图像的高度与宽度
height(高度)
width(宽度)
五、其他
图像地图

<map>

图像地图中的可点击区域

<area>

1.5 表格

表格

<table> 

每个表格均有若干行

<tr>

每行被分割为若干单元格

<td>

数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等
边框 border
不定义边框属性,表格将不显示边框
表头

<th>

浏览器会把表头显示为粗体居中的文本
行合并 colspan=""
列合并 rowspan=""
表格标题

<caption>

表格列的组

<colgroup>

表格列的属性

<col>

表格的页眉

<thead>

表格的主体

<tbody>

表格的页脚

<tfoot>

1.6 列表

一、有序列表

<ol>

一列项目,列表项目使用数字进行标记。

<ol>标签,每个列表项始于<li>标签。
  1. 大写字母列表 type="A"
  2. 小写字母列表 type="a"
  3. 罗马数字列表 type="I"
  4. 小写罗马数字列表 type="i"
    (一)例子
    在这里插入图片描述
    二、无序列表
<ul>

一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。

<ul>标签,每个列表项始于<li>标签。
  1. 圆点列 style="list-style-type:disc"
  2. 圆圈列表 style="list-style-type:circle"
  3. 正方形列表 style="list-style-type:square"
    (一)例子
    在这里插入图片描述
    三、自定义列表
<dl>

不仅仅是一列项目,而是项目及其注释的组合。

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

在这里插入图片描述

1.7 区块

一、块级元素
在浏览器显示时,通常会以新行来开始(和结束)。
高度和宽度是可控的。
宽度默认为100%。
块级元素中可以包含块级元素和行内元素。

<h1>-<h6>,<hr>,<p>,<ul>,<ol>,<dl>,<table>,<form>,<div>等等。

二、内联元素
在显示时通常不会以新行开始。
高度和宽度及内边距是不可控的。
宽高默认为内容宽高,不可改变。
行内元素中只能行内元素,不能包含块级元素。

<b>,<a>,<img>,<br>,<span>,<input>等等。

1.8 表单

一、表单

<form>

表单用于收集不同类型的用户输入。
是一个包含表单元素的区域。
二、输入标签

<input>

输入类型是由类型属性type定义的。
三、文本域

<input type="text">

在表单中键入字母、数字等内容时,就会用到文本域。
大多数浏览器中,文本域的缺省宽度是20个字符。
四、密码字段

<input type="password">

密码字段字符不会明文显示,而是以星号或圆点替代。
五、单选框选项

<input type="radio">

从若干给定的选择中选取一个。
六、复选框

<input type="checkbox">

从若干给定的选择中选取一个或若干选项。
七、提交按钮

<input type="submit">

单击确认按钮时,表单的内容会被传送到另一个文件。
动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
(一)语法

<form name="命名" action="传值到的页面" method="get">
	        命名<input type="text" name="命名">
	        <input type="submit" value="命名">
        </form>

八、其他

<textarea>		多行文本域
<label>		    输入标题
<fieldset>		一组相关的表单元素,并使用外框包含起来	
<fieldset>		元素的标题	<legend>
<select>		下拉选项列表
<optgroup>		选项组	
<option>		下拉列表中的选项

1.9 框架

一、语法

<iframe src="URL"></iframe>

该URL指向不同的网页。
二、属性
使用框架,可以在同一个浏览器窗口中显示不止一个页面。
用height和width属性定义iframe标签的高度与宽度。
用frameborder属性定义iframe表示是否显示边框。
设置属性值为 “0” 移除iframe的边框。
用iframe可以显示一个目标链接的页面。
目标链接的属性必须使用iframe的属性。

1.10 脚本

客户端脚本

<script></script>

既可包含脚本语句,也可通过src属性指向外部脚本文件。
JavaScript使HTML页面具有更强的动态和交互性。

1.11 字符实体

预留字符必须被替换为字符实体。
在HTML中不能使用某些字符,这是因为浏览器会误认为它们是标签。

空格		&nbsp;
小于号		&lt;
大于号		&gt;
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值