html学习总结

HTML学习总结

本学期新开设了一门让我十分感兴趣的课程：web基础教学，在这个课程当中，我们将会了解和掌握如何利用HTML5来构建Web页面（网页），用CSS（bootstrap库）来美化Web页面（网页），以及利用JavaScript来进行简单的客户端交互等方面的基础知识。 通过该课程的学习，我希望在未来能自己建设一个中等复杂程度的静态页面，同时为今后使用服务器端的动态网页技术构建网站打下基础,以致能进行现代Web应用的开发。

1.开发工具

俗话说的好，工欲善其事，必先利其器。在课上，讲师为我们科普了Webstorm这一个十分强大的开发工具，但是对于我们学生来说，这是一个商业软件，所以老师并不推荐我们使用，而是推荐了我们更熟悉的VS Code，在下载了VS Code后，老师向我们推荐了几个十分好用的插件，例如Auto Close Tag、Auto Rename Tag、Code Runner、IntelliSense for CSS、Material Icon、Open HTML in Browser、Path Intelligence等。其次，为了更好的浏览网页，老师推荐我们下载chrome浏览器或Firefox浏览器。

2.HTML5初步

何为HTML

web基础应用开发首先从HTML开始学起，HTML是超文本标记语言的缩写，英文名为HyperText Markup Language，是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。 通常我们需要掌握的标记/标签十分基础，如常见的body、head、title、p、img、a、div、span、ol、table等。HTML 是构成 Web 世界的一砖一瓦。它定义了网页内容的含义和结构。除 HTML 以外的其它技术则通常用来描述一个网页的表现与展示效果（如 CSS），或功能与行为（如 JavaScript）。HTML 不是一门编程语言，而是一种用于定义内容结构的标记语言。

HTML文档建立

首先打开我们已经下载好的vs code，如图所示新建一个我们存放文件的文件夹（Auto Save是老师推荐的一个插件，这样能够自动保存代码）

在文件夹中新建一个后缀名为.html的文件，例如

接着在code区域点击鼠标右键，在之前老师推荐了下Live Sever 这个插件（能够实时的通过我们代码来对网页进行改动）点击即可打开由代码生成的网页

部分功能及实现

标题

html提供了从大到小六个标题 ，分别是从h1~h6,

This is heading 1

This is heading 2

This is heading 2

This is heading 2

This is heading 2

This is heading 2

在页面中，最重要的就是标题，一个好的标题能够让读者对网站产生兴趣。

文本格式

在html中有许多文本格式，如下

mark:You can use the mark tag to highlight text.

del:This line of text is meant to be treated as deleted text.

s:This line of text is meant to be treated as no longer accurate.

ins:"This line of text is meant to be treated as an addition to the document.

u:This line of text will render as underlined

small:This line of text is meant to be treated as fine print.

strong:This line rendered as bold text.

em:This line rendered as italicized text.

超链接

超链接语法

其中，href为超链接要跳去的地址，target属性为_blank以为以一个新窗口打开

图片

其中，src为图片路径，alt表示当图片获取出现错误时，会产生的文字。

表格

有时，页面的内容需要用表格来进行呈现。我们使用table等标签即可：

Firstname	Lastname	Age
Jill	Smith	50
Eve	Jackson	94

列表

列表分为有序列表和无序列表，其中，无序列表使用ul标签，默认使用实心圆点作为每项的标志，其它的标志可以是空心圆circle，实心方块square以及不出现标志。

• Coffee
• Tea
• Milk

有序列表用ol标签,默认使用数字作为每项的标志：

1. Coffee
2. Tea
3. Milk

至此，我们对HTML有了基本的掌握。更多想要学习的可以去
菜鸟驿站