自己学习过程中的一些笔记,制作大网页还需去开发软件,一些小网页可以直接新建文本文档,再将后缀改为html即可。
一、HTML基本元素
基础类型:
标签 | 作用 |
<!DOCTYPE> | 定义文档类型 |
<html> | 定义 HTML 文档 |
<head> | 定义关于文档的信息 |
<title> | 定义文档的标题 |
<body> | 定义文档的主 |
<h1>to<h6> | 定义 HTML 标题 |
<p> | 定义段落 |
<br> | 定义简单的折行 |
<hr> | 定义水平线 |
<!-...--> | 定义注释 |
注:<!DOCTYPE> 声明位于 HTML 文档的第一行, <html> 标签之前。
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
文档的内容......
</body>
</html>
框架类型:
标签 | 作用 |
<frame> | 定义框架集的窗口或框架 |
<frameset> | 定义框架集 |
<noframes> | 定义针对不支持框架的用户的替代内容 |
<iframe> | 定义内联框架 |
图像类型:
标签 | 作用 |
---|---|
<img> | 定义图像。 |
<map> | 定义图像映射。 |
<area> | 定义图像地图内部的区域。 |
<canvas> | 定义图形。 |
<figcaption> | 定义 figure 元素的标题。 |
<figure> | 定义媒介内容的分组,以及它们的标题。 |
<svg> | 定义 SVG 图形的容器。 |
音频:
标签 | 作用 |
---|---|
<audio> | 定义声音内容 |
<source> | 定义媒介源 |
<track> | 定义用在媒体播放器中的文本轨道 |
<video> | 定义视频 |
列表元素:
标签 | 作用 |
---|---|
<ul> | 定义无序列表 |
<ol> | 定义有序列表 |
<li> | 定义列表的项目 |
<dir> | 定义大号文本 |
<dl> | 定义定义列表 |
<dt> | 定义定义列表中的项目 |
<dd> | 定义定义列表中项目的描述 |
<menu> | 定义命令的菜单/列表 |
<menuitem> | 定义用户可以从弹出菜单调用的命令/菜单项目 |
<command> | 定义命令按钮 |
格式化:
标签 | 作用 |
---|---|
<abbr> | 定义缩写 |
<address> | 定义文档作者或拥有者的联系信息 |
<b> | 定义粗体文本 |
<bdi> | 定义文本的文本方向,使其脱离其周围文本的方向设置 |
<bdo> | 定义文字方向 |
<cite> | 定义引用(citation) |
<code> | 定义计算机代码文本 |
<del> | 定义被删除文本 |
<dfn> | 定义定义项目 |
<em> | 定义强调文本 |
<font> | 定义大号文本 |
<i> | 定义斜体文本 |
<ins> | 定义被插入文本 |
<mark> | 定义有记号的文本 |
<meter> | 定义预定义范围内的度量 |
<pre> | 定义预格式文本 |
<progess> | 定义任何类型的任务的进度 |
<q> | 定义短的引用 |
<s> | 定义加删除线的文本 |
<samp> | 定义计算机代码样本 |
<small> | 定义小号文本 |
<strike> | 定义加删除线文本 |
<strong> | 定义语气更为强烈的强调文本 |
<sup> | 定义上标文本 |
<sub> | 定义下标文本 |
<time> | 定义日期/时间 |
<var> | 定义文本的变量部分 |
<wbr> | 定义可能的换行符 |
上面是我觉得构建小网页可以用得到的,当然不全面,我会根据自己的学习情况进行更新的。
最简单的自我介绍网页,有很多不足,因为我也在学习中,还请各位大佬赐教。
<!DOCTYPE html>
<html>
<head>
<body background="img src\99.jpg" >
<title>个人简介</title>
</head>
<body>
<br/>
<ul>
<li>姓名:xxxxxxx</li>
<br/>
<li>出生年月:xxxxxxx</li>
<br/>
<li>籍贯:***省***市***村***街道</li>
<br/>
<li>学历:本科</li>
<br/>
<li>民族:少数</li>
</ul>
<br/>
<p>
我的性格开朗,做人诚实正直,具有很强的求知欲,与同学相处融洽,既具有合作精神,有有很强的独立工作能力,本人具有开阔视野及全局观念,思维开放,活跃,理解,接收新事物的能力较强,心态好,自信,自律性强,虚心,好学,善于创新,学习感悟能力强.....
</p>
</body>
效果图如下: