当前课程知识点:计算机文化基础 >  第9课:从图像传感器看世界的物联 >  实践:HTML入门实践 >  HTML基本标记

返回《计算机文化基础》慕课在线视频课程列表

HTML基本标记在线视频

HTML基本标记

下一节:综合样例(上)

返回《计算机文化基础》慕课在线视频列表

HTML基本标记课程教案、知识点、字幕

那么如何来编辑

这么样一个文档呢

可使用任何一种文字处理软件

来编辑HTML文档

Windows中附件记事本

就可以胜任

其中插入的HTML标记

只有用浏览器

才能被解释

最终在浏览器窗口中

呈现出图文并茂的网页

比如说我们搜狐这种页面

我们可以来看一下它的这个源代码

这里头有很多的

带有尖括弧的

就是HTML的标记

我们就可以通过查看

这个菜单命令

打开记事本

就可以查看到

它里头的HTML代码的写法

这里呢

我们用XHTML来写

那么我们来看看

XHTML的文档结构

XHTML是可扩展的

超文本标记语言

可以认为是HTML4.0的

规范版

一个HTML文档

可以分为

文档类型说明

和文档数据

两个区域

文档类型

由Document type来定义

文档数据区

由HTML元素

来定义

文档数据又分两部分

文档头和文档体

文档头由Head元素来定义

用来定义网页的标题

等头部信息

如网页的标题

作者 关键字等

这个标签之间的内容

不会显示在浏览器中

而文档体

由Body元素来定义

Body元素内

可包含所有的

页面元素

网页中显示的内容

都要定义在Body元素内

下面就来介绍

我们来制作

这样一个样例文档

需要用到的

一些常用的标记

Body元素

然后段落标记

然后标题的

h1到h6

然后超链接的元素

然后图像元素

水平线

项目列表

然后区域元素div

这几个元素

Body元素呢

这里头的属性

text属性

就可以设置

里头文字的显示颜色

bgcolor这个属性

可以设置网页的背景色

background属性可以设置网页的背景图

比如说我们这一个

就设置了背景色是黑颜色的

文字的颜色是黄颜色的

这样最后的显示的效果

就是黑背景

黄色颜色的文字

而下面这个例子呢

拿一个小图片作为一个背景图

文字的颜色是蓝颜色的

就看到这种效果

段落元素p

就是用来为文档分段的

这个p还有结束的这个p之间

就是一个段落

比如说我们这个例子中

一共有三个段落

标题我们让它居中对齐

中间这段文字

左对齐

最后一段

就右对齐

所以我们最后看到的这种效果

align这个属性呢

就可以来设置

对齐的方式

可选的有

左中右

换行元素这个br

它就可以强制换行

比如说我们在记事本中

写了这么一段诗

看上去有五个段落

有回车

但是在浏览器中显示出的效果呢

就是在一行显示出来了

为了让它能够分成这样的分行

那么我们在每一行的后头

加上一个br这种强制的换行

最后浏览出的效果呢

就会在下一行显示出

这段文字

水平线hr

就是起分隔作用的

它有几个属性

一个就是它的高度

size这个属性

就可以设置为

一个高度

直接写成hr呢

就产生一条默认大小的水平线

灰颜色的

100%宽度的这么一条水平线

下面这个例子呢

就是宽度是4的

没有阴影的这么一条水平线

所以跟上面一个比呢

它就是宽了一些

下面这个呢

就设置一个粉颜色的

左对齐的

宽度是70%的

这么一条水平线

这个百分比呢

它是相对于浏览器的大小

它是一个相对的单位

最后这条水平线呢

设置是750像素的

这是一个绝对的单位

这是一个浅紫色的

这么一条线

居中对齐

默认的它就是居中对齐的这种效果

还有这种区块元素

div它就是给文档分节的

使文档的不同部分

应用不同的格式

常常来配合样式表来使用的

比如说我们刚才那段诗

春眠不觉晓这段诗

它默认的是左对齐的

我们要想让它居中对齐

就可以把整个这部分

塞到div这个标记里头去

而且我们可以设置它一个居中对齐

这样整个这段诗

就在页面中都居中对齐了

标题元素

h1到h6

共6级

它的写法也是

在中间呢

就把你的标题写在里头

h1的这个样式

是最大的

h6的字是最小的

所以说这是h1到h6

这6级标题的这种样子

它也有对齐的属性

用align

可以左右中

对齐

清单元素

ol是顺序清单

可以产生这样

像123这样的

清单

无序清单用ul

就可以产生这种实心的这种圈

或者空心的这种圈的

这样的清单

那里头具体的每一个项目

用li

比如说我们这块呢

就是用ol

里头有三个项目

产生的这种顺序清单

下面这段呢

就是个无序清单

也是留了三个项目

当然有多个项目都可以往里头来添加

在页面中添加图片

用img

这个标记

用SOURCE这个属性

就可以把添加图片的这个路径

标识进来

这里头路径呢

我们用相对路径的写法

这样保证可以在不同的机器打开

都可以看到这种图片

这个图片 像这幅图片呢

它也是右对齐

也可以用align这个属性

right这个值

来表示

让它右对齐

超链接用a这个标记

href呢

来把超链接的这个

目的意义来标识

因为我们这里头只作了一个页面

所以用的就是URL链接

可以链接到外部

它的这种写法呢

就是用HTTP

上面就是一个网址

就可以来跳转到这个对应的这个网址上

如果打开的这个超链接

想在新的一个页面来打开

就可以用target这个属性

然后让它去指向一个空白的一个窗口

计算机文化基础课程列表:

第1课:说在前面的话

-由一个短片引出......

--由一个短片引出......

-梳理IT产业大脉络(上)

--梳理IT产业大脉络(上)

-梳理IT产业大脉络(下)

--梳理IT产业大脉络(下)

-你的第一门计算机入门课

--课程介绍及要求

-实践:图像处理入门

--实践小作业要求

--操作前的几点准备

--操作1:素材整体布局

--操作2:制作收割后裸露土地的效果

--操作3:人物主体抠像

--操作4:图像合成的余下步骤

-第1课习题作业

-第1课导学帖

--第1课导学帖

第2课:揭开计算机的神秘面纱

-现代计算机为什么是电子数字的?

--数字装置与模拟装置

-二进制与十进制有什么区别?

--了解二进制

-为什么莱布尼兹没有认识到二进制的重要性?

--与、或、非

--二进制数的数字实现

-从ENIAC到现代通用计算机

--ENIAC到现代计算机

--新材料带来新发展

-摩尔定律会失效吗?

--摩尔定律失效

-讲座:计算机世界中的巨无霸

--计算机世界中的巨无霸

-参观:感受世界巨无霸(太湖之光)

--神威太湖之光简介

--探秘神威太湖之光

--神威太湖之光应用领域

-参观补充:走进济南国家超算中心

--走进国家超算中心

-实践:我的计算机有多快?

--我的计算机有多快?

-第2课习题作业

-第2课导学帖

--第2课导学帖

第3课:数字世界中形形色色的“数”

-数码相机是如何“计算”出一张数字照片?

--照相机如何感知世界

--如何拍摄彩色照片

-认识图像数字化过程中的采样和量化

--采样和量化

--像素、分辨率和色深

-计算机是如何感知声音波形的?

--声音量化三要素

-换一种思路来数字化文本信息

--机内码是如何产生的

--字符集的发展历程

-实践:常用网络资源下载

--常见下载方法介绍

--常见文件类型下载

- 第3课习题作业

-第3课导学帖

--第3课导学帖

第4课:最熟悉的陌生人APP

-软件解决的目标是什么?

--软件的目的是什么

-我们使用的软件是怎么来的?

--软件是怎么来的1

--软件是怎么来的2

-操作系统拥有什么样的神力?

--开机过程发生了什么

--操作系统的演变1

--操作系统的演变2

--CPU的管理调度

--虚拟存储技术

--统一驱动外设的方法

-访谈:如何成功研发一款手机APP

--互联网模式下的APP

--ColorV的应用亮点

--如何在互联网中掘金

--ColorV操作讲解

-实践:如何利用注册表进行系统优化

--注册表概述

--用注册表进行系统优化

--注册表与信息安全

-第4课习题作业

-第4课导学帖

--第4课导学帖

第5课:数据如何安好

-数字存储前言

--梳理数字存储历史

--磁、光存储介质

--半导体存储介质

-怎样在存储介质上表示1和0?

--光盘怎样表示1和0

--磁带和半导体怎样表示

-怎样从存储介质读取1和0?

--怎样读取1和0(上)

--怎样读取1和0(下)

-如何找到所需的数据?

--如何找到数据(上)

--如何找到数据(下)

-实践:文章排版基本技能

--引言

--中文输入

--排版的基本编辑对象

--打印字符与非打印字符

--图文混排

--页面设置

--利用样式润色文件段落

--利用表格布局标题

--分栏和首字下沉

--设置页眉与页脚

--设置插图润色排版

--LaTeX入门

-第5课习题作业

-第5课导学帖

--第5课导学帖

第6课:演示文稿制作

-演示文稿制作准备

--操作前的几个概念

--实践前的环境准备

--参考上机练习完成制作

-制作演示文稿

--具体版式幻灯片制作1

--具体版式幻灯片制作2

--具体版式幻灯片制作3

--具体版式幻灯片制作4

--幻灯片切换动画效果

--幻灯片元素动画效果1

--幻灯片元素动画效果2

--幻灯片元素动画效果3

--设置超链接按钮

--设置超链接文本

--设置演示文稿背景音乐

-作品赏析

--咖啡作品:演示效果的普适性

--机器猫作品:路径动画和背景音效

--夏天的风作品:Mac OS制作

--游戏作品:密室逃脱(上)

--游戏作品:密室逃脱(下)

-第6课习题作业

-第6课导学帖

--第6课导学帖

第7课:从单机到联网

-联网目的和资源共享模式的变迁

--中央主机-终端联网

--资源共享模式

--异构网互联

-物联网连入互联网

--互联网与因特网

-访谈:PC在智能穿戴生态系统中的定位

--对话联想(上)

--对话联想(下)

-参观:联想创新中心掠影

--探秘联想创新中心

-第7课习题作业

-第7课导学帖

--第7课导学帖

第8课:+互联网

-从网络组织来描述计算机网络

--计算机网络的定义

--通信线路和设备(上)

--通信线路和设备(下)

--网络软件

-从功能角度来认识计算机网络

--网络体系结构

--IPv4(上)

--IPv4(下)

--IPv6

--查看IP地址/DNS

-实践:网络不通怎么办

--网络连接

--用ping测试连通性

--ipconfig确定配置

--默认网关的MAC地址

--如何知道数据走哪条路

-第8课习题作业

-第8课导学帖

--第8课导学帖

第9课:从图像传感器看世界的物联

-认识图像传感器

--认识图像传感器

--图像传感器的应用

--图像传感器的市场

--图像传感器发展阶段

-图像传感器的应用

--在汽车中的应用1

--在汽车中的应用2

--物联网中的应用

-了解图像传感器技术

--图像传感器的技术

-图像传感器的挑战

--问题与挑战

-讲座:如何在大数据中精准生活

--走进大数据

--探秘腾讯大数据平台

--生活中的大数据

-实践:HTML入门实践

--HTML作业要求

--HTML基本标记

--综合样例(上)

--综合样例(下)

-第9课习题作业

-第9课导学帖

--第9课导学帖

第10课:从信息为王到选择为王

-认识搜索引擎

--这就是搜索引擎

--著名的搜索引擎公司

--搜索引擎技术的发展

--搜索引擎的目标与广告

-信息检索背后的关键技术

--海量数据的获取

--建立快速有效的索引

--搜索结果排名

-搜索引擎的未来

--情境感知的搜索

--社会化搜索

--智能搜索

-实践:Aminer学术搜索

--Aminer介绍

-第10课习题作业

-第10课导学帖

--第10课导学帖

第11课:信息安全知多少

-信息安全的基本要求

--信息安全的基本要求

--早期的计算机安全

-新型的网络攻击有哪些

--联线网络信息安全专家

--信息泄露

--信息安全与社会工程学

--移动安全

-未知攻 焉知防

--未知攻焉知防

--未知攻焉知防2

--信息加密

--安全防范原则

-实践:Excel实践

--认识Excel表格

--实例操作

--实例操作2

--实例操作3

--绘制图表

-第11课习题作业

-第11课导学帖

--第11课导学帖

第12课:说在后面的话

-回顾与展望

--回顾与展望1

--回顾与展望2

--回顾与展望3

--回顾与展望4

-什么是计算

--什么是计算

-访谈:信息技术交叉应用

--对话风投专家1

--对话风投专家2

--对话风投专家3

-嘉宾分享:闲谈数字产业创新

--闲谈数字产业创新(上)

--闲谈数字产业创新(下)

-第12课习题作业

-第12课导学帖

--第12课导学帖

HTML基本标记笔记与讨论

也许你还感兴趣的课程:

© 柠檬大学-慕课导航 课程版权归原始院校所有,
本网站仅通过互联网进行慕课课程索引,不提供在线课程学习和视频,请同学们点击报名到课程提供网站进行学习。