00:00
好,我们继续来上课,那么上一关呢,我们介绍了我们这个lamp网站的架构,那么今天呢,我们开始来进入到我们HTML的事件,对吧?那么我们再去讲那么网站架构的时候,我们说了我们要做一个这个动态网站对吧?我们所需要哪些构建,第一是我们的浏览器对吧?第二呢,就是我们的这个HTML做什么超文本标记语言对吧?哎,那它的全拼叫做赫德蒙德的全拼叫hyper test。A hy p。T,然后。Markup吧M。A。Up。Language超文本标记语言。LAGE啊,好了啊,这就是咱们的HTML,叫做超文本标记语言对吧?也就是说它可以在文字这个文本文件里边啊,不光是包含文字,还可以包含什么链接啊,图片、声音、动画也智能内容啊,这就是咱们的HTM啊。那么在学习TL之前呢,我们也来了解一下HTMR5的这个发展路程,因为大家现在也知道现在非常火的东西嘛,HTL5对不对?嗯,不会再有人认为是HTR,而是H5啊,那么H5是怎么来的呢?那在H5之前肯定有H3H4对吧,H2H1啊,那么咱们来看一下在1993年由IETF这个组织啊,发布了什么HTMM1.0的版本啊,叫做Internet工程任务组啊。
01:30
那么等到1995年的时候呢,由WCC接管发布H382.0的版本,那个时候网页的布局啊是用什么呢?是用表格来布局的啊,所以看起来呢,这个网页就非常的臃肿啊,所以呢,后期又开始做迭代,等1996年的时候,由WCC开始发布h3.2的版本,那这个时候呢,它也一样,也是用这个网格布局,就是表格布局啊,不是网格,是表格啊,表格布局,然后呢,但是这里边会增加了很多标签啊,增加了很多标签,那这样的话呢,要记的标签就特别多,而且特别乱啊。等到1997年开始发布了HT84.00版本,这就算是一个精简版了,那么在这个版本中就去掉了网这个表格布局啊,就开始推推荐什么呢?是div加CSS布局啊,那在1997年的时候就已经有这个div加CSS布局了。
02:21
啊,然后。这里边同样也删减了一些很多不常用的这些标签啊,等到1999年的时候,那么W3C发布了HMR4.01这个版本,这也是HTMR4的最终版啊,HTL4的最终版啊,那么在1999年同时发布这个以后,又开始干嘛呢?又分路了啊,线路一线路二分成了两条线路,线路一呢叫做叉HT码版本,什么叫叉H版本?它是一个严格的版本,也就是说它要求你这个浏览器的厂商啊,这个组织要求浏览器的厂商要用户再去写这些编码的时候,必须按照它的格式来写,就是按照它指定的规矩来写,如果没有按照指定的规矩来写,那么强制浏览器不允许解析。
03:05
那么那个时候根本就没有这么规范啊,根本就没有这么规范,所以呢,浏览器的厂商就不愿意跟他一起玩了,那怎么办?浏览器的厂商在一起,也就在1999年的时候,浏览器厂商在一起干嘛呢?开始去推进HTML5的版本。HT85的版本啊,所以准确说HT85的版本实际上在1999年就已经有了,对不对?哎,然后呢,因为每个浏览器对HT85的支持是不一样的,对吧?在这里面呢,IE老大哥是做出了贡献最大的,但是以前就是老的程序员都特别恨IE,为什么呢?因为它的兼容性特别难解决啊,尤其是IE5IE6这两个版本,当然现在我们遇不到了,对吧,我们现在一般装好的系统最低也是IE78。比如说吧,哎,高一点的,比如如果说我们IN分十的话,那下来以后应该是IE10L ie9ie11应该是这个版本了,对吧?哎,所以说现在我们这个IE啊,在这个时候其实对对这个H5的贡献也特别大啊,因为他想走他自己的线,那么他推开始主推这个HTML5。
04:09
啊,那么等到2004年的时候,这个所有浏览器的厂商在一起,他们也有个组织的名称叫word WG啊,那么在这里边他开始干嘛呢?发布了HTML5的草案啊,也就是说到2004年的时候,实际上就可以使用了啊,1999年的时候你属于内部对吧,204年其实外部如果你知道的话,其实可以用了,对吧,比如说我不知道大家,呃,有基础的应该知道,比如说input表单里边有个email项。你没有想对吧,实际上它不属于这个HT84里面的内容,它属于什么呢?它属于H85里的内容啊,浏览器厂商对他支持,那你想想你用它能不好使吗?肯定是好使的,对不对,等到2004年到2008年的时候,用W3C和什么和word WG又开始合并了啊,也就是说所有浏览器厂商不跟你玩了,对吧,那WCC干嘛,是不是孤独了,所以WCC又找谁找这word WG咱们在一起了啊,他们又合到一起了,合到一起以后。
05:04
开始一起推行什么HGTML5的版本,那么直到现今为止,其实准确的说HTL5依旧没有发布啊,依旧没有发布,但是呢,我们可以干嘛,可以正常使用,包括以后我们也不会再有什么HM6H班七啊,不会再有这种大的版本号了,那么以后是什么样呢?是比如说2019年,那就2019H 2020年呢,那就是2020H,那么2021年呢,那就是2021H嘛,也就是以年来命名它的版本号了。啊,这就是咱们HT5的发展路程,那么直到2012年的时候,HTML5才被大家所认识啊,那是由谁推动呢?在国内的市场是由什么,是由腾讯对吧?腾讯推动了什么?推动的公众号,那么公众号的开发需要什么?需要有HTML5的支持对吧?所以从公众号火的时候,我们HTML5才开始什么才开始走上上坡啊。那么H5到底是什么呢?HTM5,准确的说是HTM5的标签加上什么,加上CSS3的样式再加上什么,加上script,以及浏览器提供的API。所谓的API什么意思?就是浏览器提供的操作接口,这些加在一起才约等于HT5,所以大家不要简单的把它想象成H5,就是那么简几个标签,而像真正的H很强大。
06:23
哦,他不单纯的是这么几个标签了。能明白吧,所以大家在这里边啊,纠正一下这个误区啊,那好了,那我们对它进行了简单的了解以后呢,接下来我们就要去看如何去创建一个MR文件,那么实际上在我们这个三维官我已经创建了一个HMR文件,对吧?只要你的命名是以点HMR结尾了,那么它就是什么?就是一个H文件对吧?那么创建文件的时候我们需要注意哪些呢?这里边我跟大家说了,第一可以使用中文命名,但是不允许使用中文,为什么?因为从今天开始,我们所学的所有的东西都是老外研发的,对吧?他对中文支持不好,能不能支持,能支持啊,不是不支,不能支持,你说我就写一个,比如说我要写个首页,我就叫首页改就怎么行不行,行没问题。
07:06
啊,他不是说不允许用中文可以对吧,谁不允许用的,我不允许你用的,因为你再去做一个项目的时候,没有人会去用中文命名啊,都是用英文或者你用拼音都可以明白吧,但是就是不允许使用中文啊,不规范。另外不允许使用特殊字符,这个不用说了,对吧,你在里边,比如说你写写写一个这个这个斜线,比如你创建文件的时候,你写一个这个斜线,或者这个斜线Windows系统就已经给你提供,不让你用,对不对,因为什么?因为它的路径是冲突了啊,然后再来ID上面文件名推荐什么推荐使用小写啊,你别上来大小写给我混编可以,也不是说不可以对吧?哎,但是呢,推荐使用小写,如果是多个单词,那你可以干嘛?选择第二个首字母,第二个单词的首字母大写,比如说我在这里边建个呢,建一个美女对吧,那美女比如说我叫makeo。叫SMR,但这么写行不行也行,对吧,或者怎么样呢,比如说。
08:02
对吧,啊,Beautiful girl啊,都行啊,你这么写也可以对吧,但是你不要说没。Me IR make,你就不要这么写啊,尽量不要这么写,能不能这么大写,能不能创建,能创建啊,对创建文件是没有关系的,只是说我们要符合什么,符合它的规范啊,然后另外创建文IP文件依然是文本文件格式的话,我们需要怎么办?是不是需要将系统中隐藏已知文件类型勾勾选掉啊,对吧?这个在上一过程中我就给大家演示啊,那好了,那我们知道如何创建一条文件了,在这里边我们就来创建一个。那我们今天是第二天第二关对吧,LESSON02,然后在这里边我们新建一个文件。A,文件对吧,在这里面我直接写成一个什么,写成一个叫做这个DEMO啊,我们做一个测试是吧,DEMO好了,那你看他们能看啊,我在这里面创建文件以后,实际上它会默认有一些代码了,对不对?哎,那么有一些代码,这些代码什么意思,我们先不说啊,咱们一会儿呢,我会给大家来介绍,咱比如在这里边一样,我先给一些测试的标签啊,包括比如说我用一个已经被舍弃的标签,那在HTM5中它实际上被舍弃了,但是在HTM4里面是好使了,你看好了,在这里边我写了,写完以后他是不是给我拿了一条横线,是编辑器,这个编辑器对吧,哪个编辑器PBSTEM这个编辑器给我拿条横线,拿了条横线什么意思,表示的是在H5中已经弃用了这个标签,这个标签的作用干嘛呢?它是居中。
09:29
啊,居中的意思。居中,也就是说你写的所有的内容,只要写的这个标签里面所有的内容都是什么,都是居中的效果啊居中,那咱们来看啊,在这里边,比如说我一样,我给个一。对吧,我们在学任何一个语言的时候,第一句都去愿意写什么,写hello word对吧,那在这里边我们不写hello,我们写一个什么呢,叫做这是。我们的第一个赫特莫勒界面好了,那么有了它以后一样在下面我给他拿一条横线对吧,横线我可以给它设置一下宽度对吧,比如宽度为多少呢?我让你60%。
10:09
60%对吧,然后一样在这里边,你看我可以通过浏览,在这里面直接点浏览器,直接能访问,编辑器会帮我们做一个伪环境,你看是不是通过log host的访问的是哪个端口,这个端口,然后下面这个文,这个目录下面的这个文件,对吧?传了一个什么,传了一个参数啊,就是编辑器帮我们做的这么一个伪环境啊,我们可以去访问它,然后我给他60%的分线,是不是只有这么长啊,对吧,然后在下面,比如说我们再来干嘛呢?我给他做一首诗啊。比如说来个批标签啊,写上叫做什么呢?叫做这个。离离原上草。一岁一枯。再来一个皮标签。野火。
11:00
野火。不禁。春风。崔又生。那咱们来看啊。你不用管我这些标签什么意思啊,我们只要看最终的效果啊,来你看走你好了。诗也有了,对吧?那么在这里面我还可以干嘛呢?我还可以改它的背景颜色,对吧?光是这些标签是满足不了我们需求的,所以我可以干嘛呢?在这里面配合这样的属性对吧?那比如说在包带里边我也去配合一个属性,我想要什么呢?我让所有文字的颜色变成什么呢?变成这个井号,比如说淡蛋蛋什么颜色,黑色,对,现在看不出来,我让它变成红色,我们先变文字的颜色来找你,你看所有文字颜色都变了,对吧?然后呢,我说所有的这个背景颜色BG color,我给它再变,变成什么呢?变成一个pink粉色。
12:00
Pink分色好了,那这个时候我们再来看周易,你看我的页面是不是变化了。对吧,那OK,那这就是我们的第一个页面,你看我在这里面只要是加一行代码对不对,那对应的我浏览器的页面是不是就会改变了。所以说吧,哎,这就是咱们的HTML啊,那好了,那在这里边我们就来分析一下啊,首先我们要来了解第一个什么呢?就是HTL标签,标签是HTML最基本的单位啊,这是什么?这是个标签,这是不是也是标签,这是不也标签对吧?哎,也是最重要的组成部分,那么咱们通常标签是什么?是由这两个小括号给括起来的,对吧?而且在这里边你看我写了这么多标签,咱们也能分析出来,标签有两种形式,哪两种形式你看这种格式的,你看是不是以这个标签开始,然后加了一个斜线让他做结束,对吧?另外一种什么呢?是以这个标签后面直接跟了一个斜线。所以标签有两种形式,一种什么呢?一种是这种成对出现了,一种是什么不成对出现对吧?成对出现的我们也给它叫什么呢?双标签,那这种不成对出现了呢?叫什么叫做单标签啊,这就是咱们H前面的标签啊,那么知道标签以后,那标签区不区分它要写呢?比如说这个包的我能不能写成body,这个时候还好使吗?那咱们来看一下,在这里边我再来刷新。
13:19
有变化吗?没有吧,哎,也就是说标签本质上它是不区分大小写对不对?哎,我小写的包点跟我大写的包点是一个意思啊,但是这里面大家注意HTM面标签推荐大家输入小写啊,推荐大家输入小写啊,好,那标签我们知道了,那再往下来还有什么标签里面是是不是还配合的这些属性啊,对不对?那么HT盘属性一般都是什么呢?一般都是出现在这个H盘的标签组,知道它是H盘标签中的一部分。那么标签可以有属性,它包含了什么额外的信息?那么属性的这个值,注意要在双引号中引起来,那有人说了,我在单引号里边引起的行不行呢?
14:01
看好了,现在我再来刷新,有变化吗?没有吧,是不是也可以,对不对那一样,比如说我这是英文的对吧,我给个中文的,中文的单引号。代引号好了,那现在我们再来刷新。行吗?看是不是就变色了,变成什么,变成绿色了。变成绿色了,看到了吧。为什么变绿色了?来,咱把这个先给它删掉。把它删掉了啊。你看。准确说它变绿色是不是我的红色不识别了对不对,哎,咱们也可以干嘛,通过检测,然后在这里边我们去找他。找到这个文字,找到这个文字以后啊,你会发现啊,在这里边多了一个哎字字。来,你看color。知道了吧,给了一个什么,它自动给我们加了,是不是变成了一个RGB。是不是给了这么一个三原色对吧,当然这个东西呢,可能还不懂,不懂标记后期我会讲啊,那么正常来说,也就是我这么写的是不识别的对吧。
15:06
所以大家记住,从今天开始,我们遇到的所有的符号都为英文状态。都为英文状态看到了吧,啊,当你们英文状态的read这个时候你看它才能识别是红色看到了吧,哎,否则他是不是给你篡改了。对不对,哎,当然他其实也是支持,只是干嘛,只是给你篡改了啊,然后再往后给他这个。B。啊,聚焦的为粉色,回到刚才那个状态啊,所以大家在这里边要注意啊,所有的标点符号一定要给我用什么用英文状态下了啊,从今天开始所有的标点符号都要用英文的,而且在这里边属性值推荐用双引号,不推荐用单引号,至于为什么等到后期我们学到服务器端语言的时候,大家都知道,因为在服务器阶段语言的时候,我们经常会在一起进行混编,那么混编的时候他推荐什么用单引号,服务器端语言用单引号,这个A3码的用什么用双引号,所以大家记住在这里边我们经常用什么用双引号。
16:07
一个标签里面是不还可以存在多个属性,你看这里面是不是存在两个属性了,对吧,那么多个属性之间用什么用空格分割是不是就可以了。对不对,哎,这就是咱们这个属性啊,这就是咱们的这个属性。好了,而且属性和属性值一般都是成对出现的,前面是属性名,后面是属性值,对不对,但是一样后期我们也会有一些什么呢?也会有一些单属性,那么那些单属性一般都在什么呢?在我们的表单中会常有什么叫单属性呢?比如说我就直接给一个,我瞎给了SE,诶我直接给这么一个属性,那别的都不给了,对吧,这个单属性,那么单属性它有没有默认值也有,它实际上默认值就是true。啊处表什么意思,表示真的意思啊,所以这个呢,大家现在可以不理解啊,可以不理解,你也可以不知道,但你记住等后期我们还会再去讲这种单属性啊,所以单属性就是不需要给属性值,属性名就等于属性值一个意思啊,这是咱们单属性。
17:02
好了,那一样,那属性我们了解了,那接下来像比如说像我们设置这种字体颜色的啊,设置背景颜色的这种属性,是不是还有这个颜色值啊,那么颜色值你看刚才我用的是什么?用的是这个英文单词的,它是支持的,在这里边呢,我用的什么?用的是这种这种格式的,对吧?其实这叫什么格式,这叫六位的16进制啊,FFC 0CD,这是16进制啊,那么这种颜色值它也是支持的啊,只是说这种颜色值表示什么意思呢?刚才我们是不是看到了,通过我们去检索的,刚才在这里边检索是不是看到一个RGB。来你看这里边我给,虽然我给的是红色read的,但最后它是变成了RGB,括号255,逗零,逗号零对吧?这个RGB是什么意思呢?R表示红色red g表示green green绿色,然后B表示blue,蓝色,红绿蓝是不是三颜色,哎,那咱们来看在这个画图工具里边,其实它就已经有红绿蓝,比如说边际颜色在这里边,你看红绿蓝色三颜色,它叫什么RGU了,对吧?那不要紧,比如说红色值我给它最大二五五,你看这个时候是不是颜色是零的。
18:07
对吧,好了,那我给它还原变成零,那么绿色,如果我给他255,你看是不是变成绿的对吧,好还原我也变成零,还有蓝色,如果给他255,你看是不是就蓝色。看到了吧,哎,这就是咱们的三颜色,那么这三个颜色组装在一起,是不是能组装成各式各样的颜色,比如这个红色我给200,蓝色我给255,变成什么?变成紫色了,如果绿色我再给人100呢?是不是蛋子了?对不对,哎,也就是说它们加一起能变成很多颜色,比如说绿色变成255。红色我变成零,那你看这不偏类似于天蓝色。对吧,如果红色我给它变成255。蓝色变成零,你看是不是黄色看到吗,如果。这个都变成25是不是就白色了对不对,那好氯我给它变成零是不是就这这叫什么,这是。粉色吧,深粉的是吧,啊紫色应该叫对不对,哎,那OK,这就是咱们这个红绿蓝三原色,那么咱们通过这种六位的16进制,它是怎么来设置的。
19:07
也一样看好了啊,我在这里边,比如说这个红色啊,我给他改改什么呢?井号FF0000,好了,你看现在它是不是也是红色啊。字的颜色刷新有变化吗?是不是依然是红色对吧?那么我给这个井号FF00什么意思呢?其中这两个F就是前两位表示什么呢?表示RGB中的R啊,中间呢,变成什么就是G。结尾呢,就是B,那么16进制的F你转换成十进制怎么转换啊,你不会算不要紧,咱们拿计算器有一个什么,这里面是不是有个腾序员计算器,那么你看十,16进制的最大值是不是F对吧?FF现在可能大家对16进制还不不了解对吧?那你不需要去记的,你只需要知道16进制最大值是F对吧?这里边我给了两个F,两个F转换成十进制的时候是不是255。对吧,那么相当于在这个位置是不是就设置了一个什么,是不是就设置了一个25500。
20:04
我在这边写个备注啊。哎,是不是相当于我两个F,是不是相当于转换成十进制以后就变成了多少,变成了255啊255啊,对不对,那还有俩零呢,这俩零我再转换成十进制多少,那零转成十肯定是什么,肯定依然是零的,对不对,那你看是不是这样的啊,在这里边一样回到16进制,我给他退出,哎不对,清楚清楚以后,你看俩零我是不是摁了两下,我再多按多少下都无所谓,那转换成二进制啊,不对,错了,转换成这个十进制是不是1340。对不对,哎,那OK,那这也一样是零。所以它们对应的对应什么,对应的RGB的话啊,那它是不是就是红色对吧,这个G没有,是不是什么都没有对吧,然后再来一个什么B是吧,对准RGB对吧?那这种格式我也可以给简写,简写为什么呢?简写为井号F00,也就是说前面如果是相同的,我可以给它省略,就要变成F00,你看是不是依然是红色。
21:03
所以依然是红色对不对?那比如现在我想让字体变成黄色,字体颜色要变成黄色,我应该怎么办?是不是第一位红色区域是255,黄色区域也是二五不对。绿色区域也是二五对吧,红跟绿加一起是什么?黄色对吧?然后最后蓝色区域变成零,那也就是井号F0对吧?当然它的全写应该是FF00,我说了如果前后是相同的,我是不是可以简写为FF0啊对吧?哎,那现在你看我井号FF0是不是黄色来走你。这边是黄色。知道吧,哎,有人说那这个老师我不会这个这个颜色值的拼接,对吧,我不知道这个俩F是零,那你不要紧,你可以通过这个颜色选择器,对吧?选择完以后,你看这里面是多少,你对应的就给它多少是不是就可以了,比如说这是217对吧,比如我我就要这个颜色了啊,这个红色是217,蓝色是217,绿色是零对吧,那217我们可以转一下呀,对吧?比如说在这里边我们是十进制的217,那要转换成什么,转换成16进制是不是第九,那OK,那也就是说在这里边它我给它分成什么B。
22:07
九对吧,然后FF,呃,不对,不是F了,是00D。是不是这样的,那现在来看。刷新。是不是变紫色了?看到了吗?哎,所以大家记住啊,在这里边我们给的这个值叫什么呢?是16进制的颜色值啊,其中前两位表示什么红色区域,中间两位表示蓝色对吧?什么绿色,最后两位表示什么?表示的是蓝色啊,这就是咱们这个16位的16进制的颜色值啊,那么它不光支持六位16进制的,还是什么,还支持英文单词的对吧?那你会什么单词,你就写什么单词就可以了啊,比如说在这里边我们刚才说的紫色对吧?P我给他P好,那现在咱们来看。在这里边我再来刷新页面。你看就变身了。哎,这就是咱们给一个英文单词的格式啊,好,那么另外。
23:01
这个颜色值我们知道了,还有什么呢?还有它的注释啊,注释的好处干嘛呢?它可以方便查找比对,也可以方便其他程序员能快速了解我们的代码,也方便以后我们对自己代码的理解,你看比如说现在这里边我写了一个center,对吧,我不知道center是什么,在这块我是不是就加了一个注释,这就是注释。啊H跳白注释就以坚果号叹号杠杠开始,以杠杠结果号结束,中间书写注释的内容,注释的内容是不会被浏览器解析出来的,你看好了,在这里边啊,我怎么刷新能看到刚才我写的那些注释吗?是不是根本没有什么时候能看到,只有在查看网页源代码的时候才会有看到了吗?这是不是还会有啊?对不对?哎,所以大家记住啊,在我们编写页面的时候,一定要干嘛呀,一定要多加注释对吧?加注释的好处咱也不用说了,刚才我已经跟大家说过了,对吧?方便什么查找、比对、替换对吧?哎,也方便别人快速了解你的代码和你自己对代码的理解,因为代码一旦写的时候,我们可能会写很多,一个首页可能我们要写几百上千行的代码,对吧?那么这个时候写的太多,你也会忘记某一块是什么内容,所以干嘛呢?我们需要给它加个注释作为什么,作为我们的提醒。
24:12
那么注释我们知道以后啊,一样大家记住注释的格式以结果号叹号杠杠开始,以杠杠结果号结束,而且这些都是英文状态的符号啊,都是英文状态的符号,那么注释我们知道,我们再来看什么呢?看一下XMY代码的格式,大家看啊,我在背写代码的时候,比如说包里边,你看啊,我给它缩小,包里边包含谁,是不包含了一个center。对不对,那你看在这里边的层级关系,我是不是就给你们进行了缩进呢?对不对,Center center里边又包含了一堆标签,那你看它里边的所有标签,我是不是又给他进行了一个缩进,那么也就是说。里边有这么多孩子,哪些孩子这是一个,这是一个,这是一个,这是一个,这四个标签是不是同级的对不对,哎,然后呢,Center是不是他们的父类。对吧,那body是不是center的父类,那你相当于body是不是的他们四个的爷爷类了,对不对?哎,这样的话看起来格式是不是就非常清晰啊。
25:06
哎,所以大家记住啊,在我们去编写代码的时候。一定要干嘛,一定要给他缩进,但是这个缩进不是用空格顶出来的,不是这样的,空空空空空空啊不是啊,怎么做出来的,我是按了一次table键,它会自动给我补位四个空格。啊,按一次配不键,它就会补位四个空格,你看好了,比如说一样啊在P里边,P里边我可不可以再标标签也可以对吧,那再包含的标签,比如说我给他加一个B标签。然后再来一个结束的B标签,那这个时候你来看啊,整个这个一岁一枯荣,它有一个加粗的效果,看到了吗?它是不是要比其他这些字体要出危险。对不对,哎,所以大家记住啊,我只要是在这里边有层级关系,一定要干嘛给他K播键进行缩进,你不要所有东西都干嘛,都给顶格来写,那那样看起来是不是就很难看了,你看啊。
26:01
你看如果说这样写,你看看起来是不是很难看,是不是没有它清晰啊,对不对,哎,所以大家记住啊,在这里边我们一定要给,干嘛给他这种缩进的格式啊,而且大家注意。在AR里边任何的回车空格在源代码中是都不起作用的,你看比如在这里边回车回车,哎呀。给我打一个回车回车回车空格空格空格空格推不见推不见推不键对吧,然后在这里边一样,你看好了我再刷新。看有变化吗?是没有变化。对不对,哎,所以大家记住啊,不用去担心这些,我们再去编写代码的时候,要给他什么,给他开播键对吧?诶让他这个什么代码更清晰,代码清晰也便于什么,便于我们的团队合作啊,所以大家在这一块一定要记住啊。好了,那另外比如说我刚才看到了我们这个浏览器里面不帮我们去解析这种空格,那有的时候我就想给个空格,比如说这个野火烧不尽是吧,我给个空格,你看它能不能给我识别一个空格啊,野火烧不尽这块啊来。
27:03
走你诶。确实有一个小空格的对吧?哎,因为我是在内容里面,它是可以识别的,那如果给多点呢,二三四五六七八九十十一十二十三十四十五十六十一十八十九二十好。摁错键了。再打开一下。好了,那你看我给了再多的空格,注意啊,你看这里边我是给了空格了,对不对,我给了再多的空格,在这里边是不是只会解析一个小空格对吧?这是在内容中啊,这是在内容中,所以大家记住,那这个时候比如我真的想让他给更多客人怎么办?我就不能用这种方式,我可以干嘛呢?给他实体的字符啊,也就是说X玛支持实体字符叫什么and的NBSP啊,牛逼的空格对吧?在and nb SP我给了两个,那这个时候你看它是不是就会给我分出两个空格来走。
28:08
看是不是又给我分一个对吧,那同样我再加一个呢,再加一个and nb SP再来走,你你看好了,这回再来刷新是不是又多一个了。对不对,哎,这就是咱们的空格实体,那么包括比如说我想在页面里面去显示一个标签,咱们来看啊,比如在这里面我们来一个什么呢?来个e Du e Du w,你说有这样的标签吗?肯定没有,对吧,这什么,这是融资教育对不对?所以这里边我写一个你看好了融资教育。融资教育啊,那现在咱们来看刷新,你看是不是只给我显示了一个融资教育,对吧,其他的东西都没有,都没有对吧,他会干嘛呢?他也把它当成标签来解析了,对不对,只要是你写出这种格式,他就给你把当成标签来解析了,但是呢,我们是怎么想呢?我想的是让他原封不动的就给我说出这句话来,对不对?哎,所以这个时候它是不行的,那怎么办,我是不是就要把这个东西给它变成实体,它本来是有意义的,对不对,因为它是HMR的标签的这个最基本的符号,对吧?所以这里边那这个小于号,我要给它变成实体叫什么呢?And的LT。
29:13
这是小于号大于号的实体呢,叫and气体,好了,那现在你们来看,我再来刷新,哎,前面的是不是就出来了,那前面出来,后面我还想出来,是不是把这两个也变一下。And LT。大于号。RGT对吧,然后再来。刷新你看是不是也可以了。哎,这三个实体字符就是我们最常用的啊,一个什么空格,一个是小于号,一个是大于号,对吧,当然它还有更多,比如说还有什么版权符号啊,比如说叫做and。Copy coy coy反圈括号,我们看一下怎么样的,就是一个圈一个C。一个圈一个C看到了,当然这个版面包你说我不记得行不行,我直接拿过来,你看我复制了一个出来啊,现在你看我再刷新页盘中是不是又多一个。
30:04
对不对?哎,所以这种我不用实体字符也可以,对不对?只要我能找到它,我复制一个出来就可以了,对不对?所以大家不需要去记那么多,你只需要给我记住三个实例字符就足够用啊,这就是HTMR最基本我们要了解的内容啊好了,那我们来看一下笔记,再总结一下啊,这里边创建文件咱说完了,你看H天盘标签,咱说了标签是I天盘最基本的单位,也是最重要的组成部分,那么通常用两个角括号来括起来,对吧?一个是小于号,一个是大于号,那么标签呢,有两种形式,一个是成对标签,我们叫做双标签,对吧?以P开始,然后内容一批结束,是不是这种成对的?那么另外一种不成对标签,我们叫做什么单标签,就直接是HR垂线。哎,这里边我写的这种东西大家不用理会啊,这是一个标记,这是因为我用的是点MD结尾的,对吧,这是一个markdown的语法啊。然后再往下来H键盘标签的大小写问题,咱说了标签的大小写无关对吧?包得与这个包得表示意思是一样的,大家注意的什么H键盘标签推荐时候小写啊,然标签属性呢?那么HT属性一般都出现在HT标签中啊,是HTM标签的一部分,那么标签可以有属性,包含了额外的信息,属性的值一定要在双引号中,而且标签还可以存在多个属性对吧?那么一般属性有属性名和属性值成对出现对吧?当然我也说了,后期我们也会接触,什么接触单属性就是不成对的对吧?那么成对出现的语法叫什么呀?标签名对吧?后面是什么?属性名一等于属性值,属性名二等于属性值是不是这种格式对吧?多个属性之间是不是用空格来分割对吧,属性值用什么用双引号给引起来对吧,但是大家一定注意是什么英文状态下的双引号。
31:43
这是什么呢?属性,属性完事,我们介绍了颜色对吧?那么他说浏览器都支持颜色名称及格,颜色只是一个关键字,或者是一个RGB格式的数字,在网页中都用的很多啊,那么英文单词作为颜色值,那RDB,红色对吧?Green blue pink p p对吧?你会多少个单词,你可以写多少个单词啊,然后再来六位的16进制颜色值,这个我跟大家讲了对吧?那么其中前两位表示红色,中间两位表示绿色,最后两位表示蓝色啊,也就说红绿蓝三个颜色对吧?然后简写为什么井号F00对吧?如果是这种的,我们可以给它简写啊,那么咱们给他16进制颜色值,能不能给RGB的格式呢?比如在这里边同样啊,我们再回到这里面再来测试一下。
32:28
啊,我说什么呢?我说RGB。RGB括号。对吧,这里。我不给他直接这么写啊,比如说我说25500,你看可不可以啊。没有变。是不是不行啊,哎,不行的话来再加我,就这里边我再给他双引号。抓紧可以吗?是不是也不行,你看啊,在检查的时候。我们可以干嘛,通过检查来看看浏览器怎么给他解析的对不对,比如在这里边你看点击RGB的时候,你看2500对吧,那实际上这里面他给的颜色是谁,Color和那个color啊,是这个颜色。
33:08
知道了吧,哎,也就是说它不识别这个家伙说不识别,如果识别那肯定都变了对不对,哎,所以这里边啊,我们尽量我给大家说了那个我们就记那个就足够大家用的了啊,不记没说的,你也不用去尝试好了,我给你再还原回来啊,来保存一下。OK,这个字体颜色又回来了,对吧?那OK,那现在再回到我们的笔记里边来,那么颜色值我们说完了再来说这个注释啊,那么注释的好处在说过方便查找比对方便其他程序员快速了解你的代码,也方便以后自己对自己代码的理解和修改啊,而且注释的内容不会被浏览器解析出来啊,那么注释的格式呢,是以坚果号叹号开始,以那个。杠杠进口号结束啊,这是什么呢?注释,然后另外H代码格式咱说了,任何回车或者空格在源代码中都不起作用,所以在编写H代码时都可以使用回收和空格进行什么代码的排版,这样可以干嘛清晰的。
34:06
可以让代码更清晰对吧,便于团队合作,而且必须保持严格的缩进规则,那么缩进以table键为准,也就是说在以后变译代码的时候,我是用如何什么样的格式来缩进的,那么你再写出也需要用我对应的格式来进行什么相应的缩进啊,然后再往后HTML的实体对吧?咱们说有介绍了这么几个,一个什么按NB空格,还有小于号和大于号,我说了这里边重要的就这三个对吧?哎,我说只是说又有这个什么意思,不光是这三个,还有更多的,那我们剩下的我们一般都不用啊,所以大家只要记住这三个就可以了啊好了,这就是咱们这个初步识别H8啊,初示H码。那OK,那这节课我们就到这里,下节课我们来看一下我们HTL的主体结构。
我来说两句