【前端系列教程之HTML5】01_HTML概述

一、Web前端开发工具

1.1、常用前端开发工具介绍

软件开发工具是用于辅助软件生命周期过程的基于计算机的工具。通常可以设计并实现工具来支持特定的软件工程方法,减少手工方式管理的负担。

作为一个前端开发工程师,使用一款自己上手且功能强大的开发工具是非常重要的,但是面对这么多开发工具,到底哪个比较好呢?下面给大家推荐几款自己感觉还不错的前端开发工具,希望作为大家的参考。

1.1.1、Editplus/Nodpad++

        EditPlus是一款由韩国 Sangil Kim出品的小巧但是功能强大的可处理文本、HTML和程序语言的Windows编辑器,你甚至可以通过设置用户工具将其作为C,Java,Php等等语言的一个简单的IDE。

        EditPlus(文字编辑器)汉化版是一套功能强大,可取代记事本的文字编辑器,拥有无限制的撤消与重做、英文拼字检查、自动换行、列数标记、搜寻取代、同时编辑多文件、全屏幕浏览功能。而它还有一个好用的功能,就是它有监视剪贴板的功能,同步于剪贴板可自动粘贴进 EditPlus 的窗口中省去粘贴的步骤。另外它也是一个非常好用的HTML编辑器,它除了支持颜色标记、HTML 标记,同时支持C、C++、Perl、Java,另外,它还内建完整的HTML & CSS 指令功能,对于习惯用记事本编辑网页的朋友,它可帮你节省一半以上的网页制作时间,若你有安装IE3.0 以上版本,它还会结合IE浏览器于 EditPlus 窗口中,让你可以直接预览编辑好的网页(若没安装IE,也可指定浏览器路径)。因此,它是一个相当棒又多用途多状态的编辑软件。

        最大特点没有代码提示功能,只有语法高亮。因此初学HTML,英语基础又不好的同学可以首选。

        下载地址: https://www.editplus.com/download.html 

1.1.2、Adobe Dreamweaver

        Adobe Dreamweaver,简称“DW”,中文名称 "梦想编织者",最初为美国MACROMEDIA公司开发,2005年被Adobe公司收购。DW是集网页制作和管理网站于一身的所见即所得网页代码编辑器。利用对 HTML、CSS、JavaScript等内容的支持,设计师和程序员可以在几乎任何地方快速制作和进行网站建设。

        Adobe出品,出道多年。最新版本已经是CC 2019了,不推荐选用老版本,老版本对新语法支持不是太友好,新版本对电脑性能有一定要求。

        工具内置浏览器功能很强大!建议初学者使用:

        下载地址: https://www.adobe.com/cn/downloads.html?promoid=RL89NGY7&mv=other

1.1.3、HBuilder、HBuilderX

        HBuilder是DCloud(数字天堂)推出的一款支持HTML5的Web开发IDE。 HBuilder的编写用到了Java、C、Web和Ruby。HBuilder本身主体是由Java编写.

        它基于Eclipse,所以顺其自然地兼容了Eclipse的插件。

        快,是HBuilder的最大优势,通过完整的语法提示和代码输入法、代码块等,大幅提升HTML、js、css的开发效率。

        HBuilderX,是当前最快的HTML开发工具,强大的代码助手帮你快速完成开发,最全的语法库和浏览器兼容性数据让浏览器碎片化不再头痛。

        下载地址: http://www.dcloud.io/

1.1.4、Sublime Text

        Sublime Text 是一个代码编辑器,也是HTML和散文先进的文本编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展功能的Vim。

        神器!轻量级IDE,神器神在可扩展性,工具包含大量实用插件,我们可以通过安装自己领域的插件来提高工作效率。支持VIM模式(LINUX推荐)、支持宏(批处理)。

        集成了各种插件很方便。右边没有滚动条,取而代之的是代码缩略图。强大的快捷命令“可以实时搜索到相应的命令、选项、snippet和syntex。可以跳转到任意文件的任意位置。

        下载: http://www.sublimetext.com/

1.1.5、WebStorm

         WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。目前已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源,继承了IntelliJ IDEA强大的JS部分的功能。

        优秀的代码定位能力,能轻松将光标定位到变量/属性/方法的定义处,对阅读代码非常有用。nodejs 最好的开发工具。

        下载: https://www.jetbrains.com/webstorm/

1.1.6、Visual Studio Code

         Microsoft在2015年4月30日Build 开发者大会上正式宣布了 Visual Studio Code 项目:一个运行于 Mac OS X、Windows和 Linux 之上的,针对于编写现代 Web 和云应用的跨平台源代码编辑器。

        微软推出的良心之作。是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义快捷键、括号匹配和颜色区分

        软件界面优美,多种自带主题可选,甚至可以自定义背景图片。

        下载地址: https://code.visualstudio.com/

1.2、VS Code安装

通过 Visual Studio Code - Code Editing. Redefined ,下载VSCode安装包

双击 VSCodeUserSetup-x64-1.39.1.exe,点击确定

 接受许可协议,点击下一步

 选择安装位置[尽量避免C盘以及中文目录/空格],点击下一步【推荐集中安装在二级目录】

 选择开始菜单文件夹,可以使用默认的

 选择其他任务,勾选全部,点击下一步

         勾选之后,文件以及文件夹可以通过VS Code打开;

安装准备就绪,点击安装

 等待安装完毕

 点击完成即可

1.3、VS Code配置

欢迎界面

 首先,安装汉化插件,点击Extensions,在输入框中输入chinese,点击install进行安装;

 其他插件安装 (步骤同汉化插件)

        Auto Close Tag (自动闭合HTML/XML标签)

        Auto Rename Tag (自动完成另一侧标签的同步修改)

        Beautify (格式化 html ,js,css)

        Bracket Pair Colorizer(给括号加上不同的颜色,便于区分不同的区块)

        Debugger for Chrome(映射vscode上的断点到chrome上,方便调试)

        ESLint(js语法纠错,可以自定义配置)

        HTML CSS Support (智能提示CSS类名以及id)

        HTML Snippets(智能提示HTML标签,以及标签含义)

        jQuery Code Snippets(jQuery代码智能提示)

        Markdown Preview Enhanced(实时预览markdown)

        markdownlint(markdown语法纠错)

        Material Icon Theme(vscode图标主题)

        Icon fonts(图标字体)

        open in browser(右键快速在浏览器中打开html文件)

        Path Intellisense(自动提示文件路径)

        React/Redux/react-router Snippets(React/Redux/react-router语法智能提示)

        Vetur(Vue多功能集成插件,错误提示等)

        Class autocomplete for HTML(智能提示HTML class =“”属性)

        npm Intellisense(require 时的包提示)

        Emmet (提升编写 HTML/CSS 代码效率的文本编辑器插件)

        Live Server(开发本地服务器与动态页面动态重新加载功能)

1.4、VS Code 快捷键

1.4.1、界面窗口

1.4.2、导航

1.4.3、基础编辑

1.4.4、搜索和替换

1.4.5、多光标和选择

1.4.6、语言编辑

1.4.7、编辑器管理

1.4.8、文件管理

1.4.9、调试

1.4.10、显示

1.4.11、集成终端

1.5、浏览器

        任何上过网的用户对浏览器是再熟悉不过了。只是用户看到仅仅只是浏览器本身,却很少能看到浏览器最核心的部分 - 浏览器内核。从第一款libwww(Library WorldWideWeb)浏览器发展至今已经经历了无数竞争与淘汰了。现在国内常见的浏览器有:IE、Firefox、QQ浏览器、Safari、Opera、Google Chrome、百度浏览器、搜狗浏览器、猎豹浏览器、360浏览器、UC浏览器、遨游浏览器、世界之窗浏览器等。但目前最为主流浏览器有五大款,分别是IE、Firefox、Google Chrome、Safari、Opera

        浏览器最重要的部分是浏览器的内核。浏览器内核是浏览器的核心,也称“渲染引擎”,用来解释网页语法并渲染到网页上。浏览器内核决定了浏览器该如何显示网页内容以及页面的格式信息。不同的浏览器内核对网页的语法解释也不同,因此网页开发者需要在不同内核的浏览器中测试网页的渲染效果。

1.5.1、浏览器世界大战

        浏览器大战,指不同的网络浏览器之间的市场份额竞争。

        常用来指以下两组竞争:第一组是20世纪时微软公司的Internet Explorer取代了网景公司的Netscape Navigator主导地位,这场大战甚至引发了美国诉微软案官司。第二组为2003年后Internet Explorer份额遭其他浏览器蚕食,包括Mozilla Firefox,Google Chrome,Safari和Opera。

 第一次大战:

        第一次浏览器大战发生在上个世纪90年代,微软发布了它的IE浏览器,和网景公司的Netscape Navigator大打出手,最后网景不得不将公司卖给AOL一走了之。世界由此平静了。但平静并没有能够持续太久,日益壮大的Mozilla Firefox从2004年又开始重新叫板微软地位。

        最早开始推出互联网浏览器的是美国伊利诺斯大学的National Center for Supercomputing Applications (NCSA)的Mosaic浏览器。之后很多人获得了这款浏览器的授权,开始开发自己的浏览器,比如Spry Mosaic, Spyglass Mosaic (微软的IE就是基于这一款)和大家熟识的后来Marc Andreseen的网景公司前身Mosaic通讯公司。

        在1995年以前,网景是互联网浏览器的绝对标准,因为虽然它的正式版本要收费,但是评估版是随便下载而且免费的。尽管微软从1995年8月开始发布IE 1.0,但真正惊动市场的是1997年10月份发布的IE 4.0浏览器。这一款浏览器比网景更好的遵循了World Wide Web Consortium (W3C)提出的互联网标准,并能够提供一些诸如MP3播放之类的功能。自此以后,IE破竹之势一发不可收拾,再加上微软巨大的财力、人力后盾,网景终于在1998年以48亿美元的价格出售给了AOL公司。而后,网景被AOL变成了它ISP业务的门面,网景浏览器的核心团队至此已经全部离队。于是,第一回合微软大胜。

        然而,事情并没有就此结束。1998年网景公开了它的浏览器源码,并重新命名为Mozilla,全部程序进行了重写。2002年发布了第一个版本。2004年基于Mozilla源码的Firefox首次登台,拉开了第二次浏览器大战的序幕。直到同年2月份,微软的浏览器份额已经从最高点的96%下降到了85%,主要是由于Firefox的强烈市场攻势。于是乎,微软再次全力以赴,迅速提前了原定配合Longhorn Windows版本的IE 7.0的发布日期,用来与火狐狸(Firefox)抗衡。

第二次大战:

        第二次大战并不像第一次那么简单。这次不只是IE和火狐狸的斗争了。一些新的基于不同引擎的浏览器也加入了阵营,比如挪威的Opera (基于Presto引擎)和中国的Maxthon。目前Opera的主要战场在移动设备,大部分的智能手机都配有Opera的移动浏览器。而Maxthon【傲游】的主要阵地在中国,根据百度的统计,15%的百度用户都在使用这个浏览器。

1.5.2、五大主流浏览器

Internet Explorer(windows默认安装)

        Internet Explorer,是微软公司推出的一款网页浏览器。原称Microsoft Internet Explorer(6版本以前)和Windows Internet Explorer(7、8、9、10、11版本),简称IE。在IE7以前,中文直译为“网络探路者”,但在IE7以后官方便直接俗称"IE浏览器"。

        2015年3月微软确认将放弃IE品牌。转而在windows 10上,用Microsoft Edge取代了Internet Explorer。微软于2015年10月宣布2016年1月起停止支持老版本IE浏览器。

        2016年1月12日,微软公司宣布于这一天停止对Internet explorer 8/9/10三个版本的技术支持,用户将不会再收到任何来自微软官方的IE安全更新;作为替代方案,微软建议用户升级到IE 11或者改用Microsoft Edge浏览器。

Opera浏览器

        Opera是挪威Opera Software ASA公司旗下的浏览器。1995年,opera公司发布第一版Opera浏览器,使用自己研发的Presto内核。当时opera公司的开发团队不断完善Presto内核,使Opera浏览器一度成为顶级浏览器。

        直到2016年奇虎360和昆仑万维收购了Oprea浏览器,从此也丢弃了强大的Presto内核,改用当时Google开源的webkit内核。后来Opera浏览器跟随Google将浏览器内核改为Blink内核。自此Presto内核也淡出了互联网市场。

Safari浏览器

        Safari是苹果计算机的操作系统macOS中的浏览器,使用了KDE的KHTML作为浏览器的运算核心。Safari 是一款浏览器、一个平台,也是对锐意创新的公开邀请。无论在 Mac、PC 或 iPod touch 上运行,Safari 都可提供极致愉悦的网络体验方式,更不断地改写浏览器的定义。

        Safari,苹果计算机的操作系统macOS中浏览器,用来取代之前的Internet Explorer for Mac。Safari使用了KDE的KHTML作为浏览器的计算核心。 该浏览器已支持Windows平台,但是与运行在macOS上的safari相比,有些功能出现丢失。Safari也是iPhone手机、iPod Touch、iPad平板电脑中iOS指定默认浏览器。Safari 以惊人速度渲染网页。与 Mac、PC 及 iPod touch、iPhone、iPad完美兼容。

Firefox浏览器[推荐]

        Mozilla Firefox,中文俗称“火狐”(正式缩写为Fx或fx,非正式缩写为MF),是一个自由及开放源代码的网页浏览器,使用Gecko排版引擎,支持多种操作系统,如Windows、Mac OS X及GNU/Linux等。该浏览器提供了两种版本,普通版和ESR(Extended Support Release,延长支持)版,ESR版本是 Mozilla 专门为那些无法或不愿每隔六周就升级一次的企业打造。Firefox ESR 版的升级周期为 42 周,而普通 Firefox 的升级周期为 6 周。

        自Firefox 29起,浏览器界面有很大程度改变。

        根据英国防病毒公司Sophos的最新调查数据显示,Firefox连续三年成为互联网用户最受信赖的浏览器。

Chrome浏览器[推荐]

        Google Chrome是一款由Google公司开发的网页浏览器,该浏览器基于其他开源软件撰写,包括WebKit,目标是提升稳定性、速度和安全性,并创造出简单且有效率的使用者界面。

        Google Chrome的特点是简洁、快速。GoogleChrome支持多标签浏览,每个标签页面都在独立的“沙箱”内运行,在提高安全性的同时,一个标签页面的崩溃也不会导致其他标签页面被关闭。此外,Google Chrome基于更强大的JavaScript V8引擎,这是当前Web浏览器所无法实现的。

        另有手机版的Chrome浏览器,于2012年发布了Chrome浏览器移动版,提供IOS系统、安卓系统以及Windows Phone系统的Chrome浏览器,在保持浏览器原有特点的情况下,实现了多终端使用浏览器,具有共享收藏历史信息等功能,是手机浏览器的一次巨大突破。随着Android系统的份额不断扩大而市场占有率不断飙升。

1.5.3、浏览器内核

        浏览器最重要或者说核心的部分是“Rendering Engine”,可大概译为“渲染引擎”,不过我们一般习惯将之称为“浏览器内核”。负责对网页语法的解释(如标准通用标记语言下的一个应用HTML、JavaScript)并渲染(显示)网页。 所以,通常所谓的浏览器内核也就是浏览器所采用的渲染引擎,渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同,因此同一网页在不同的内核的浏览器里的渲染(显示)效果也可能不同,这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。

        四大内核分别是:Trident(也称IE内核)、webkit、Blink、Gecko。五大浏览器采用的都是单内核,而是随着浏览器的发展现在也出现了双内核。像360浏览器、QQ浏览器都是采用双内核。

        作为前端开发,熟悉四大内核是非常有必要的。四大内核的解析不同使网页渲染效果更具多样化。

1、IE浏览器内核:Trident内核,也是俗称的IE内核;

2、Chrome浏览器内核:统称为Chromium内核或Chrome内核,以前是Webkit内核,现在是Blink内核;

3、Firefox浏览器内核:Gecko内核,俗称Firefox内核;

4、Safari浏览器内核:Webkit内核;

5、Opera浏览器内核:最初是自己的Presto内核,后来是Webkit,现在是Blink内核;

6、360浏览器、猎豹浏览器内核:IE+Chrome双内核;

7、搜狗、遨游、QQ浏览器内核:Trident(兼容模式)+Webkit(高速模式);

8、百度浏览器、世界之窗内核:IE内核;

9、2345浏览器内核:以前是IE内核,现在也是IE+Chrome双内核;

二、HTML概述

        HTML5时代的到来,对所有的前端开发人员来说是一种福音,它致力于解决跨浏览器问题,可以部分取代JavaScript(标签封装了某些行为),也致力于把浏览器变成一个前端执行开发环境,而不是简单的视图呈现工具。

2.1、网页、网站、应用程序

        网站(Website [ˈwebsaɪt])是指在因特网上根据一定的规则,使用HTML(标准通用标记语言下的一个应用)等工具制作的用于展示特定内容相关网页的集合。简单地说,网站是一种沟通工具,人们可以通过网站来发布自己想要公开的资讯,或者利用网站来提供相关的网络服务。人们可以通过网页浏览器来访问网站,获取自己需要的资讯或者享受网络服务。

        注:因特网(Internet)是一组全球信息资源的总汇。有一种粗略的说法,认为INTERNET是由于许多小的网络(子网)互联而成的一个逻辑网,每个子 网中连接着若干台计算机(主机)。Internet以相互交流信息资源为目的,基于一些共同的协议,并通过许多路由器和公共互联网而成,它是一个信息资源 和资源共享的集合。

        网页是构成网站的基本元素,是承载各种网站应用的平台。通俗地说,您的网站就是由网页组成的

        网页是一个包含HTML标签的纯文本文件,它可以存放在世界某个角落的某一台计算机中,是超文本标记语言格式(标准通用标记语言的一个应用,文件扩展名为.html或.htm)。网页通常用图像档来提供图画。网页要通过网页浏览器来阅读

        应用程序是指为了完成某项或某几项特定任务而被开发运行于操作系统之上的计算机程序。应用程序与应用软件的概念不同,但常常因为概念相似而被混淆。软件指程序与其相关文档或其他从属物的集合。一般我们视程序为软件的一个组成部分。

        例如,一个游戏软件包括程序(exe)、其他图片(*bmp等)、音效(wav等)等附件,那么这个程序(“exe)称作应用程序,而它与其他文件(图片、音效等)在起合称软件。

        应用程序(Application)运行在用户模式,它可以和用户进行交互,具有可视的用户界面。

2.2、HTML是什么

        HTML 是用来描述网页的一种语言。

        HTML 指的是超文本标记语言 (Hyper Text Markup Language),“超文本”就是指页面内可以包含图片、链接,甚至音乐、视频等非文字元素。

        网页的本质就是超文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。

        HTML 指的是超文本标记语言: HyperText Markup Language,是一种用于创建网页的标准标记语言。

        HTML 不是一种编程语言,而是一种标记语言。

        标记语言是一套标记标签 (markup tag)

        HTML 使用标记标签来描述网页

        HTML 文档包含了HTML 标签及文本内容

        HTML文档也叫做 web 页面,使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。

2.3、HTML5是什么

        万维网的核心语言、超文本标记语言(HTML)的第五次重大修改。

        2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成。而且大部分现代浏览器已经具备了HTML5支持。HTML5是web时代最前沿的技术,它特有canvas标签和多种选择的游戏开发引擎,让游戏开发更便捷。如果说苹果重新发明了手机,那么HTML5则重新定义了网络。

        它是链接手机、平板电脑、PC以及其他移动终端的桥梁,可以更丰富地展现页面,让视频、音频、游戏以及其他元素构成一场华丽的代码盛宴。

2.4、HTML的发展历程

        现在我们常常习惯于用数字来描述HTML的版本(如:HTML5),但是最初的时候我们并没有HTML1,而是 1993年IETF团队的一个草案,并不是成型的标准。

        两年之后,在1995年HTML有了第二版,即HTML2.0,当时是作为RFC1866发布的。有了以上的两个历史版本,HTML的发展可谓突飞猛进。

        1996年HTML3.2成为W3C推荐标准。之后在1997年和1999年,作为升级版本的4.0和4.01也相继成为W3C的推荐标准。

        在2000年基于HTML4.01的ISO HTML成为了国际标准化组织和国际电工委员会的标准。于是被沿用至今,这期间虽然有点小的改动但大方向上终归没有什么变化。

        从1993-2000之间短短的7年时间,HTML语言有着很大的发展,基于诸多人的努力,终于产生了我们现在用的HTML语言。

        HTML 5 的第一份正式草案已于2008年1月22日公布,仍继续完善

        2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成。

2.5、HTML5发展前景

        HTML5是WEB的未来,不仅在电脑端,而且在移动端也一定会得到广泛的应用。 据统计2013年全球将有10亿手机浏览器支持HTML5,同时HTML Web开发者数量将达到200万。

        毫无疑问,HTML5将成为未来5-10年内,移动互联网领域的主宰者。 据IDC的调查报告统计,截至2012年5月,有79%的移动开发商已经决定要在其应有程序中整合HTML5技术。

        WEB技术发展越来越迅速,HTML5的到来更是把WEB技术推向了巅峰,目前HTML5技术已经日趋成熟,HTML5的未来十分光明,值得我们去学习。

2.6、Web基础概述

2.6.1、网站的构成

网站由三个主要部分组成:

        1、网站域名:访问网站所用的网址,如metinfo.cn;

        2、网站程序:包括用户浏览网站所看到的页面和网站后台管理程序,现在一般都是用成熟的网站管理系统。

        3、网站空间:可以是虚拟主机或服务器,用于存储网站程序及资料,并提供网站程序运行所需要的环境。

页面的构成被分为三个主要部分:结构(Structure)、表现(Presentation)和行为(Behavior)。

2.6.2、页面的构成

结构:

        HTML(HTML4.01),(Hyper Text Markup Language)超文本标记语言,它不是一种编程语言,而是一种标记语言,通过使用标记标签来描述网页;

        XHTML,(EXtensible HyperText Markup Language)指可扩展超文本标签语言,与 HTML 4.01 几乎是相同的,只是更严谨更纯净,他出现的目标原本是为了取代HTML,但刚刚兴起就被HTML5取代了;

        HTML5,HTML的最新版本,增加了语义化标签,以及很多新特性,使HTML变的更加灵活强大,虽然仍处于完善之中。但大部分现代浏览器已经具备了某些 HTML5 支持

表现:

        CSS,指层叠样式表(Cascading Style Sheets),是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言

行为:

        JavaScript,是世界上最流行的脚本语言,用来给页面添加动态效果和动态交互,这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。

2.6.3、B/S和C/S

        B/S结构(Browser/Server,浏览器/服务器模式),是WEB兴起后的一种网络结构模式,WEB浏览器是客户端最主要的应用软件。这种模式统一了客户端,将系统功能实现的核心部分集中到服务器上,简化了系统的开发、维护和使用。客户机上只要安装一个浏览器,服务器安装SQL Server、Oracle、MySql等数据库。浏览器通过Web Server 同数据库进行数据交互。

        B/S最大的优点就是可以在任何地方进行操作而不用安装任何专门的软件,只要有一台能上网的电脑就能使用,客户端零安装、零维护。系统的扩展非常容易。

         C/S是Client/Server的缩写。客户端/服务器开发模式,服务器通常采用高性能的PC、工作站或小型机,并采用大型数据库系统,如Oracle、Sybase、Informix或 SQL Server。客户端需要安装专用的客户端软件。C/S面向特定的用户,维护成本较高,常用于局域网。

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
HTML(超文本标记语言)是一种用于构建网页的标记语言。它是一种基本的网页开发语言,用于组织和呈现网页的内容。在HTML前端开发教程中,学习者将学习如何使用HTML标签、属性和元素来创建结构化且具有良好用户体验的网页。 在学习HTML前端开发教程之前,学习者需要了解一些基本概念,如标签和元素。标签是< >中的文本,用于向浏览器描述网页的结构和内容。元素是标签和其内容的组合,比如<h1>这是一个标题</h1>。学习者还需要掌握HTML基本结构,包括<!DOCTYPE>声明、<html>标签、<head>标签和<body>标签。 在HTML前端开发教程中,学习者将学习如何使用不同的HTML标签来组织文本内容、插入图像、创建链接和表单等。学习者将学习如何使用标题标签(<h1>-<h6>)创建标题,段落标签(<p>)创建段落,列表标签(<ul>、<ol>、<li>)创建有序和无序列表,以及其他标签。 此外,学习者还将学习如何使用属性来对HTML元素进行设置,比如设置元素的ID、类、样式和事件等。学习者将学习如何使用CSS来为HTML元素添加样式和布局。通过学习CSS,学习者可以改变文字的颜色、大小和字体样式,设置元素的背景色和边框样式,以及创建响应式布局等。 最后,在HTML前端开发教程的高级部分,学习者将学习如何使用JavaScript来为网页添加交互功能。通过学习JavaScript,学习者可以创建动态效果,例如弹出窗口、表单验证和响应用户输入等。 总而言之,HTML前端开发教程将引导学习者了解HTML的基本语法和标记,以及如何结合CSS和JavaScript来创建交互性且具有吸引力的网页。这将为学习者提供扎实的基础,使他们能够进一步深入学习和实践前端开发的技能。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

我是波哩个波

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值