HTML 实例 (实例集合)

HTML 基础标签实例

HTML 文档
HTML 标题
HTML 段落
HTML 链接
HTML 图片
HTML 按钮
HTML 列表

实例解析


HTML 属性实例

title属性
href属性
width和height属性
alt属性
没有引号的属性
没有引号的属性-不起作用

实例解析


HTML 标题实例

HTML标题
HTML水平线
HTML head元素

实例解析


HTML 段落实例

HTML 简单段落
HTML 多个段落
在HTML中使用换行符
诗歌问题(HTML格式化的一些问题)
如何使用<pre>标记控制换行符和空格

实例解析


HTML 样式实例

HTML 样式
HTML 背景颜色
HTML 文字颜色
HTML 文本字体
HTML 文字大小
HTML 文本对齐方式

实例解析



HTML 文本格式实例

使用<b>元素加粗文本
使用<strong>元素进行加粗文本-增加了语义“重要”的作用
使用<i>元素设置文本斜体
使用<em>元素强调
使用<small>元素定义较小的文本
使用<mark>元素定义带有记号要么突出的文本
使用<del>元素标记删除
使用<ins>元素标记插入
使用<del>和<ins>标记删除并插入
使用<sub>元素进行下标格式化
使用<sup>元素进行上标格式化

实例解析


HTML 引用实例

使用<q>元素格式化短引号.
使用<blockquote>元素格式化带引号的节.
使用<address>元素格式化文档作者/所有者信息
格式化<abbr>元素的缩写和首字母缩略词
使用<cite>元素格式化工作标题
使用<bdo>元素格式化文本方向

实例解析


HTML 注释实例

简单的注释
用于调试的注释

实例解析


HTML CSS 实例

内联CSS
内部CSSL
外部CSS
CSS字体
使用id属性的CSS
使用CSS属性
CSS边框
CSS填充
CSS边距

实例解析


HTML 链接实例

使用绝对URL链接
使用相对URL进行链接
改变链接的颜色
更改链接的目标
图像作为链接
创建书签链接
一个突破框架的链接

实例解析


HTML 图片实例

一个图像
使用属性的图像高度和宽度
使用CSS的图像高度和宽度
使用两者的图像高度和宽度
另一个文件夹中的图像
链接断开的图像
使用图像作为链接
一个动态的图像
具有可点击区域的图像映射
图像将浮动到文本的左侧

实例解析


HTML表格实例

带边框的表格
折叠边框的表格
带有单元格填充的表格
左对齐标题的表格
带有标题的表格
表格单元格跨越多列
表格单元格跨越多行
具有单元格间距的表格
使用id I的不同风格的表格
使用id II的不同风格的表格

实例解析


HTML列表实例

无序列表(默认)
带有实心圆的无序列表
带有空心圆的无序列表
带有实心方块的无序列表
无标记符号的无序列表
有序列表(默认)
带数字的有序列表
带字母的有序列表
带有小写字母的有序列表
罗马数字的有序列表
带有小写罗马数字的有序列表
说明列表
嵌套列表
水平列表菜单

实例解析


HTML 块和内联元素实例

<div>元素
<span>元素

实例解析


HTML class属性实例

在内联元素上使用class属性
使用 class 属性指定标签类名
选择具有特定class的元素
在JavaScript中获取类(class)
多个类(class)
相同的class,不同的标签

实例解析


HTML id属性实例

设置具有特定ID的元素的样式
class和id之间的区别
带有ID和链接的书签
使用JavaScript访问具有特定ID的元素

实例解析


HTML布局 实例

使用float的布局
使用flexbox进行布局

实例解析


HTML IFrame 实例

Iframe - 设置高度和宽度 CSS来设置iframe的高度和宽度 iframe - 删除边框 设置iframe边框的大小,样式和颜色 Iframe - 链接的目标

实例解析


HTML js脚本 实例

我的第一个JavaScript
写了文字到HTML元素
JavaScript可以更改HTML内容
JavaScript可以更改HTML样式
JavaScript可以更改HTML属性
使用<noscript>标签

实例解析


HTML 计算机代码元素 实例

使用<kbd>元素用于键盘输入
使用<samp>元素用于程序输出
使用<code>定义了计算机代码的片段
编程代码格式保留空格和换行符
使用<var>标签表示变量的名称

实例解析


HTML表单实例

表单-文本输入
表单-单选按钮输入
带有文本字段和提交按钮的表单
使用没有名称(name)属性的文本字段的表单
使用 fieldset 对表单数据进行分组

实例解析


HTML表单元素实例

一个简单的下拉列表
具有预选值的下拉列表
textarea(多行文本输入字段)
一个输入按钮
使用<datalist>元素
使用<output>元素

实例解析


HTML输入类型实例

text(文本域)
password(密码字段)
radio(单选按钮)
checkbox(复选框)
button(按钮)
color(颜色) - 带颜色选择器

实例解析


HTML5 canvas实例

用lineTo()画一条线
用arc()画一个圆圈
用fillText()绘制文本
用strokeText()绘制文本
绘制线性渐变
绘制圆形渐变
使用drawImage()绘制图像

实例解析


HTML5 SVG 实例

SVG 圆形
SVG 矩形
SVG 圆角矩形
SVG 星形
SVG Logo

实例解析

HTML5 Web存储实例

永久存储名称
永久存储-增加计数器
存储一个会话的计数器

实例解析


HTML5媒体实例

播放视频文件
以HTML格式播放音视频文件

实例解析


更多HTML5实例

HTML5 拖放
HTML5 webworker
HTML5 服务器发送事件