HTML教程

1.文本元素

b元素（加粗）： 这是HTML教程

strong元素（加粗）： 这是HTML教程

wbr元素(安全换行)： this is asdfasdgasdgfasdfasdf is apple

i元素(倾斜)： 这是HTML教程

em元素(倾斜): 这是HTML教程

var元素(倾斜): 这是HTML教程

s元素(删除线):这是HTML教程

del元素(删除线): 这是HTML教程

u元素(下划线): 这是HTML教程

ins元素(下划线): 这是HTML教程

small元素(放小字体): 这是HTML教程

sub元素(下标): 这是HTML₅教程

sup元素(上标): 这是HTML⁵教程

code元素(代码块): 这是HTML教程

kdb元素(用户输入): 这是HTML教程

abbr元素(缩写): 这是HTML教程

dfn元素(表示术语): 这是HTML教程

q元素(双引号): 这是HTML教程

cite元素(引用标题): 这是HTML教程

bdo元素(文字方向): 这是HTML教程

mark元素(突出显示): 这是HTML教程

time元素(时间): 这是2019-01-01教程

span元素(跟CSS搭配): 这是HTML教程

2.超链接和路径

BaiDu


BaiDu


转入第二页

转入父目录

3.锚点链接(页面内定位)

第一章 第二章 第三章

4.分组元素

这是一个段落

这是另外一个段落

这是一个通用分组

这是另外一个通用分组

这是一个来自其他内容的引用

这是另外一个来自其他内容的引用

########

#########

#######

---

无序列表:

• 张三


• 李四


• 王五

有序列表：

2. 张三


8. 李四


9. 王五

生成说明列表：

这是第一份文件

这是第一份文件的详细信息1

这是第一份文件的详细信息2

这是第二份文件

这是第二份文件的详细信息1

这是第二份文件的详细信息2

图片链接:

这是一张图片

5.表格元素

构建基本的表格：

这是标题

姓名	性别	婚姻	基本情况
张三	男	未婚
李四	女	已婚
统计：共两人

6.文档元素

标题:

这里存放页面的表头部分：LOGO,标题，导航等.

这是大标题

这是一个副标题

这里是一个导航

主题部分:

这是文档的主题部分

这是一个文档

...

...

...

页面尾部:

这里是页面尾部，版权啊，等等

这里是联系信息

7.嵌入元素

插入图片：

在页面中插入另外一个frame：

百度 | 好搜

<iframe src="http://www.bilibili.com" frameborder="1" width="800", height="600" name="in">

嵌入插件内容：

进度条：

范围值：

8.音频和视频

音频和视频几乎一样（除了没有宽高）:

9.表单元素

1. form元素（用以用户输入数据）:

<!--action：表单提交的页面， method：用get和post提交，enctype：采用编码格式，name：表单名称，target：提交目标，
autocomplete浏览器记住用户数据，novalidate验证性,form让表单为的元素和指定的表单挂钩提交--->

注册分组

<!--input属性:autofocus:光标选中，disabled不可输入，autocomplete记住用户，type，name用提交数据的，value的默认值--->
用户名：

电子邮件：

提交

2. Input的type属性：

文本：


密码：

搜索:


数字:

范围:

日期:

颜色:

复选框: 音乐 体育

单选框: 男 女

提交:

重置:

按钮:

图片按钮:

email:

telephone:

URL:

隐藏:

上传文件:

提交

3. 下拉列表框：

苹果
橙子
香蕉


大米
稻谷
玉米


提交

4.多行文本框：

请留下你的建议

提交

10.全局属性和其他

1. 实体：将有特殊意义的字符通过实体代码显示出来

显示括号： <div> <music>

空格： 我       你

和号： &HTML

引号： "HTML

撇号：'HTML

版权：©

2.元数据meta:

2.1. 指定名/值元数据对

<meta name="author" content="bnbbs">

<meta name="description" content="这是一个HTML页面">

<meta name="keywords" content="html5响应">

<meta name="generator" content="text3">

2.2.声明编码格式

<meta charset="utf-8">

3.全局属性:

3.1. id属性:

<p id="abc">

<p id="def">

id属性给元素分配一个唯一的标识符，通常用于CSS和javascript调用选中元素，只能是独有的

3.2. class属性:

<p class="abc">

<p class="abc">

<p class="abc">

class也是用于定位，是用于元素的归类，通过CSS同时设置多个元素

3.3.accesskey元素:

<input type="text" name="user" accesskey="n>

快捷键操作，window下为Alt+指定的键

3.4.contenteditable属性:

<p contenteditable="true">

用以修改text

3.5. dir属性：

<p dir="rtl">

设置文本方向，左到右为ltr，右到左为rtl

3.6. hidden属性:

<p hidden>

隐藏元素

3.7. lang属性：

<p lang="en">

可以局部设置语言

3.8. title属性：

<p title="HTML5教程">

对元素的内容进行额外提示

3.9.tabindex元素

<input type="text" name="user" tabindex="1">

表单中按下Tab键，实现获取焦点的顺序，-1为不会被选中

3.10. style属性

<p style="color: red;">

设置行内的CSS样式

这是第一章内容

























































这是第二章内容

























































这是第三章内容