今天给大家分享两个标签,喜欢请点赞收藏。第一个要介绍的是标签来,标签中的文本显示为解体,代表一定范围的文本具有特别的语义,例如技术、术语、 外文、短语或是小说中人物的思想活动等。和之前扣标签一样,也是一个短语标签。同样,如果想要标签中显示内容更加丰富,需要配合 css 向视表进行使用,视力代码以及运行效果如视频所示。第二个要介绍的标签是 avery answer 标签,表示一个内联框架,一个内联框架被用来在当前 htm 文档中嵌入另一个文档。当使用标签的时候,可以把提示文本放置在标签之间,这样就可以应对不支持该标签的浏览器。 当浏览器不支持标签的时候,就会显示不知支持的文本提示给用户,建议用户升级浏览器。如果需要修改标签样式,比如显示框大小,修改滚动条等等的时候, 可以使用 css 相视表进行控制。标签主要用于那些多个网页的共有部分,如导航栏、广告栏等场景。接下来我们看一下它的属性,第一个属性为高度, 它指定标签的高度。第二个属性为设置标签的宽度,这两个标签就可以定义 f 人标签在页面上显示的大小。第三个属性为 dang, 他指定了 afram 的名字。第四个属性为 sandbox, 规定了在 fram 框架中的内容启用一些额外的限制条件,通过 sandbox 属性提升 fram 的安全。 三 box 属性可以防止不信任的 yd 页面执行某些操作。第一个是空值,代表启动所有限制条件。第二个只指的是允许表单提交。第三个只指的是允许将内容作为普通来源对待,即嵌入的浏览上下文章和复元素被视为来自一个独立的源。 第四个值表示允许执行脚本。第五个值表示嵌入的页面的上下文可以导航加载内容到顶级的浏览上下文环境。如果未使用该关键字,这个操作将不可用。第六个是指允许嵌入的浏览上下文打开模态窗口。 第七个是指允许在没有征求用户统一的情况下下载文件。第八个是指允许弹窗。第五个属性作用是使标签看起来像是副文当中的一部分,没有边框和滚动条。第六个属性是 是在页面中显示的页面的儿。第七个属性指的是是一段 atm l 代码,这些代码会被渲染到到 rain 中。 如果浏览器不支持 soca 属性,则会渲染 src 属性表示的内容。最后我们看一下势力代码以及运行结果。代码是在页面中嵌入了一个地图。
粉丝37获赞161


大家好,我是李老师,这节课呢,咱们来介绍一下列表标签 least。 首先来看一下无序列表 ul, 这里不管是无序列表还是有序列表,所有的列表像标签都是 li, 咱们的列表像的内容都要写在 li 和杠 li 之间。 然后看一下 u l type 属相者的三种。第一种, disc 是默认值,显示效果是实心圆, circle 是空心圆,死块是实心方块。 进行情况下,他们在写完 ur 之后,里面的每一项内容如果没有指定太婆值的话,他的默认显示效果就是第四个,实心园 还有嵌套列表的情况下,里边咱们什么都没写,那么默认他从实心圆就会变成空心圆, 如果有第三层嵌套列表,就会变成实心的方块。然后看一下有序列表。 olsl 呢,主要有五种开发值,数字列表、小写字母列表、小写罗马字母列表、罗马字母列表和字母列表。 然后呢,咱们要记住他的语法结构啊,大盘等于 y 六,这个歪六值就是五种考试的时候啊,大概率会考的大小写的 a, 大小写的 a 和一,这五种大家一定要记住。

各位大家好,这是 h t m l c s s 第七个视频,在上面几个视频,我们主要讲解的是 h t m l 标签, 那么通过讲解标签,我们能够认识到标题段落列表,但是我们通过一保存他们默认的颜色和版面是这样子的,那么这一讲我们主要讲解的内容是 c s s c s s, 它的名字叫层叠样式表,那么它的作用是什么呢?就是改变我们下面这块内容,就说我们默认输入了标签的效果,我们现在看到的是白底黑字,那么 c s s 能够做到改变的 有字体颜色、背景色、添加边框等内容,以及后面的布局的这块知识点,那么他是如何改变,如何能够改变默认的这块样式呢?比如我们现在把它拿过来, 我们要用到一个 c s s, 它有一个功能叫做选择器,各位注意了,为了改变它的外观,我们要选择它, 在我们前期讲的语言主要是 h t m l, 那么为了使用 c s s, 我们要使用另外一种语言,就是 c s s, 那么我们在下边呢,输入代码叫做 style style 这个单词就是上面这个 style, 然后我们直接回车,选择第二个回车以后,那么这一讲呢,我们主要讲两个,第一个是选择器啊, 选择器,那么我们讲一个叫做标签选择器, 标签选择器,那么我们要想改变这个外观,比如上面这块内容,我们要想改变它的外观,如我们段落, 那么我们首先就改变了段落,那么一共有三个段落,那么我们就不要改,不改变标题,也不改变无序列表,那么使用的方法呢?是这样的,要用一个标签名, 段落的标签名是 p 标签,那么我们在此呢,输入一个 p, p 是段落的意思,后边来一个大括号, 大括号里边跟上一个冒号,冒号的左侧是数 属性的名称,如卡了,右侧呢是颜色 red, 那各位看好,那么现在当我保存以后,我们会发现它的变化,那么直接把段落呢?全部颜色被改变了, 改变为什么是红色?那么这种选择呢?叫标签选择题,标签选择题是通过什么来选择的?通过标签名, 他为什么不改变标题,也不改变无序列表,因为它采用的是标签名,各位同学看好,那么下面我们再来说一个,如果我要想改变 无序列表,再次的演示一下,那我们这边呢,来一个 u l u l, 然后直接来个括号,大括号,大括号表示对象 依然中间有冒号,右侧是属性的名啊,然后左侧是属性的指路,那么我们通过一保存,那各位同学,你看到是不是我们这块内容全部是通过什么改变的?通过标签名, 标签名啊,标签名来改变的,那么我们现在呢,再讲补充一个选择题,讲第二个选择题,叫做类选择题, 类选择器,类选择器是什么?我们上面是不是三个段落都被我们改变了,我们对它进行分类 啊,各位要在他每个标签都有这么一个属性,叫做 class, class 单词就是累,那么后边这块内容我们可以给他起一个名字,相当于变量名。老师用的表, 两名是 i b 开头,习惯于 i b 开头。 bag 就是白科葛庄的啊,那么我们直接起一个名字,零啊,那么我们在底部这次就不再用标签名,而要用类的名称啊,通过什么的名来改变呢?通过 lay 的名称来选择,那么 lay 的名称是什么?各位注意, lay 的名称不能直接用 i b bag, 那么我们要在它的前面加上一个点,这样呢,我们就可以区分出标签名, 如果在变量的前边加上一个点表示累,后边依然是大括号,我们现在给它添加一个什么,添加一个背景色啊,白色的卡了等于 yellow, 那么我们一保存,那各位同学,现在我们应该能看到 我们只是改变三个段落中的第几个,第二个背景色是为黄色,以此类类推。如果我们要想改变,在我们的其他的标签上也使用这样的一个类,那么我们只要写上类的名字就可以了。 i b 在一个领带,那么这块内容啊,它依然会指向下边这块内容抛,包括我们在后边的也可以这样呢,我们都会给它填上背景色。那各位你现在看到的啊, bag, 呃, bag 零按啊,前面写错了,少一个,这个名称是跟下边的名称不一样,要保持一致,叫 i b bag 零按,那跟着名称对应就好了。那这个视频就讲到这里,感谢大家的关注,支持和点赞。


htvl 标签可以拥有属性,属性是以名称直对的形式出现, 属性是在 htmil 开始。标签中规定,请看演示,比如我们给网页设置背景颜色,请看在包的标签中设置 style 等号,双引号里面显示,这里我们选 bic blod go clol 背景色冒号格瑞。这句代码的意思是设置背景色为灰色,卡车加 s 保存,保存好以后选择文件,右击选择浏览器,打开背景色已变成灰色。 颜色值我们可以使用预定义的颜色值名称如格瑞来定义,也可以使用十六静置的值来定义,如修改格瑞 瑞为井号 f f 六六六六,这个颜色是个红色,修改好以后考试加 s 保存,按快捷键 f 五刷新浏览器 背景色变成红色。关于颜色我会在后面单独讲,这里就不多做解释。再比如,我们写一个标题肩括号 h, 一开始标签肩括号斜杠 h 一结束标签 标题名称我们写 ht 秒第五讲,写好以后考出加 s 保存,再按快捷键 f 五,刷新浏览器标题显示在这里。现在标题标签文字是左对齐, 我们设置居中对齐,请看设置烂属性为三层就可以了。考试加 s 保存,按快捷键 f 五,刷新浏览器 标题以居中显示。再比如,我们设置标题字体为红色,请看设置 style, 等于双引号当中写卡了冒号 red, 这就是代表设置标题字体为红色。 考试加 s 保存爱。快捷键 f 五刷新浏览器标题字体已显示为红色,由于背景色的原因看不清楚,我们把背景色修改一下,改为灰色,再刷新下浏览器,现在看到的就比较清晰了, 总结一下,今天我们讲了如何设置背景颜色以及标题居中和标题字体颜色的更改。当然 st 马尔标签的属性有很多,会在日后 的讲解中用到的时候给大家慢慢介绍。在这里没有办法一次性讲完,下一节讲解水平线、 hr 标签以及 ht 秒注视和如何查看原代码。

今天带大家去写一下前端 html 中列表标签的一个使用。首先列表标签,它分为两种,一种有序列表,一种无序列表。我们先看无序列表,它最外层是个 ul 标签,然后里面呢是个每一个条目是个 li 标签。比如说我们从这个 uli 西门一,西门二, 然后新闻三,新闻四有四项列表,然后我们把它运行出来,看出来的效果就是前面是一个小圆点序号, 那么跟它对应的还有一个有序列表,那么外层呢是 o l, 里面呢放的也是 l i 啊,有序新闻,有序新闻 一,有序新闻二,有序新闻三,有序新闻四,然后我们把它运行出来,我们就会看到他前面默认带的是一个序号啊,那么这就是一个有序列表 ol 加 l y, 还有一个无 序列表 u l 加 l i 的一个,呃,基本使用啊,像一般前端当中我们都有一些导航,就会选择到用到这些有序或者无序标签。

大家好,欢迎来到胖胖学前端,今天我们来学习 css 导航栏,所有的网站都存在导航栏,我们如何才能实现一个导航栏呢?我们来看一下这个 demo。 一个列表元素如何才能变成像图中的这样子的一个导航栏呢?可以通过给 ul 或者 lia 标签添加样式, 首先把列表的列表像去掉,也就是左侧的小圆点,然后给大家添加宽度。背景色, 把 a 标签变成 block 元素,我们要把 a 标签去掉文本修饰,也就是底部下划线,再给 a 标签添加一个 hire 的样式,背景色或者颜色字体的变化,如图中就可以得到一个这样子的简单的导航栏。觉得讲的好就点个赞吧!

大家好,欢迎收看零基础学前端系列课程,我是主讲老师张荣明。三十三,无序列表 在本次课程中,我们将介绍无序列表以及列表的样式。首先我们来看一下无序列表, 幼儿语律表示无序列表,他们用于给文本添加无序列表的语意,象与象之间没有先后顺序之分,那么这是无序列表的定义,也就是说,你可以把一项放在前,也可以把它放在后,他们没有一个先后的顺序。 ul 呢,它是用于定义无需列表的,就 ld 的类似无需列表,而 e 呢,代表类似 im 表示列表项。 u, l 和 e 呢,这两个标签啊,必须同时出现, 不能单独书写,也就说呢,他们是一个组合标签,那么 ul 里可以嵌掏一个或者是多个里,他是专门用于嵌掏 b 标签的,也就是说, ur 中只能放置 b 标签,不能放置其他的元素或其他的内容。 而立标签呢,是一个典型的容器级标签,可以放置任何内容标签,甚至是嵌套列表,也就说我们在立中继续嵌套 ul 与立,我们一起来看一下案例。 嗯,好了,我们来看一下,比如说我们打开一个页面,哪些可以放在例中呢?也就说呢,我们看到的这些新闻列表都可以用 u l 语例去顶 意啊,与律去定义。那么有的时候呢,我们呀,也可以用 u l 和立来定义这一组导航,因为呢,他们之间呢,可能也没有先后顺序之分,也就是说呢,你可以把一项放在前,一项放在后,也可以把他们放在一个 ul 与立中, 然后在例中呢,我们再通过 spa 等其他的标签定义这些个文本,总之呢,我们在页面中发现一块一块很相似的部分,都可以看成是一个列表, 比如说我们看到这里面有奥运会相关的新闻,我们可以把它们放在 ur 与绿中,那么我们来看一下,首先先去新建一个文件, 那么在文件中呢,我们说来定义无序列表, 一百二里边我们去写力去定义,比如说呢,这里面呢,咱们把这几行给他定义出来,我们把它定义出来,好复制过来,粘贴进来好了,那么第一行放在一个立中,第二行放在一个立中,总之一行放在一个立中 好了。呃,然后呢,我们呀,打开暖气,我们会发现这就是一个无序列表。我们说你把一条新闻放在前面行不行?行, 因为他们没有先后顺序的概念,随放前随放后都可以。但需要注意的是,我们说 w 三,在规范中说呀, uir 中只能欠套利,不能或不允许欠套其他元素。 比如说,我们在一个 uri 中欠套了一个 h 一, 比如说呢,我们在这里面签到了一个 h 一,比如说这是啊,新闻列表 好了,那么此时你注意看我们一刷新呐,哎,此时注意线没有任何问题,但是我们不建议,因为呢,我们在一个 uir 中嵌套了 h 一,那么将破坏 uled 的关系。所以如果咱们这个列表有标 题,我们建议把 h 一放在育儿的外面,也就说呢,在育儿中不要去嵌套 h 一,而是啊,将这些其他的元素放在列表的外面, 放在列表的外面,那么列中他是一个容器级的标签,可以放置任何其他元素。 好,我们把上面注意掉啊,来看一下,比如说呢,我们呀,在一个一玩中, 前一个力呢,我们我们放上一个 h 一,这是一级标题, 嗯,第二个力呢,我们呀放上一个皮,这是断了的线。 第三个力呢,我们呀放上一个 spa, 哈喽,甚至下面再写个,再写个 div 等等都可以。总之利是容器级的里面可以放上若干个标签, 上面咱们写上四百标签吧, 都可以,我们打开暖气一看,没有任何问题,但是过程中我们不会这么 去做,为什么呢?因为 h 一 p 以及 dna, spa, 他们之间啊,不是像与像的关系, 也就说呢,他们的寓意是不一样的,那不一样的就不能表达一个列表的含义,或者是不能表达列表中的象的含义。所以我们说啊,如果例中的标签是不同的,或者里面的内容是不同的, 我们通常呢,不会把他们放在一个币中,如果里面的内容和标签是相近的, 或者结构是相似的,才会把它们放在一个立白线中,那么这是我们使用无序列表的一个规则,也就是说呢,象与象之间 结构和内容是相近或相似的, 此时我们才会使用列表。好了。然后呢,注意, 比如说,我们看在好一二三中啊,在好一二三中,我们说呀,我们看西门导航这一块,我们会发现呢, 那么每一行结构相近哎,那么他可以放在一个意外和例中,那么在每一行呢,哎,又若干个不同的元素,因此啊,因此我们说,此时他们可以看成是一个二级的列表,就是可以是一个 千套的列表,也就说呢,外部的列表 定一行,也就说呢,我们来看一下,一元里边呢,咱们定义 三个里边的呢,咱们分一结构,你可以说呀,哎,前面呢,比如说呢,是一个啊 spa, 后面又是一个列表,里面有这么多相似的导航,对吧?好,那就是一个 spa, 然后呢,里边是 ur, 里面是 d, 咱们给他乘以三,我们少写一点啊,好了,把这一组给他写出来。 所以我们平时啊,在工作中开发的时候,一定要注意这个寓意啊,一定要注意这个寓意啊,一定要分析好,该使用什么标签 就使用什么标签,这样是有利于我们网站的 su 优化的。 好,第三行 好了,我们打开练习,你看这是可以的,比如说呢,外面那个力代表的是这一行,而里面这个力呢,代表的是这一行中每一个导航,每一个导航,那么这是可以的。 呃,然后有的人说呀,好运三通啊,他们是显示的一行,为什么咱们没有显示一行呢?后面咱们学习四 s s 就可以 借助于 css 实现这样的效果了,不用着急。好,那么最后呢,我们说呀,无需列表也可以修改他的样式,也就说默认他的样式是什么呀?前面出现了弦点,或者说空心圆, 那么我们怎么去修改它呢?我们可以通过 ur 或者是一百下中的太部属性去修改,那么默然有以下四个属性值,分别是, boss 是一个实心圆, coco 是一个空心圆,四块是一个方块,那表示没有钥匙。 嗯,最后一句话注意,由于太把的设置的样式是非常有限的,是非常受限制的,因此在工作中我们也常常用 css 来设置来看一下,我们呀,想给他去修改一下样式,不让他是实行员了,我们可以给他一个 太是个死块或者是一个缩口。好了,那么注意看,此时我们刷新外面就是一个空心圆了,那么其中第二个例,咱们还让他是一个实心圆,那么可以给他一个太等于 好,一看,那么他就是个实行员了。好,那么上面这个列表呢?我想让他的前面的标志是一个方块,那么我们也可以给他一个 shift, 等于 好了,那么他就是一个方块了。那么如果不让他前面有样式,那么我们就给他的太设置成一个 好了,那么此时我们一看前面就没有样式了,然后想要前途往前面是一个实心园。 好了,那么我们一看就实现了。总之,无论是育儿还是实力,都可以通过太部属性来修改他们的默认样式。 以上就是本节课的主要内容,那么在本次课程中,我们介绍了羽翼 ur 表下的语音是无序列表,立的语语是立表象,它的特点是啊,育儿与例同时使用,不能单独书写。育儿呢,可以嵌套一个或多个立育儿中呢,不能放置 其他的元素,只能放置利利呢是一个容器级的标签,可以放置任何标签。样式默认四种,通过太末水晶来定义,分别是电磁芯源、缩口、空心圆,四块方块,那没有样式。 以上就是本节课的主要内容,感谢大家的支持,欢迎大家点赞、评论,收藏我们的视频,谢谢大家再见!


好,接下来呢,咱们带同学们来去学习影部的系列标签的最后一种状态叫做按钮,那咱们按钮啊,在网页中所出现的场景呢,是非常非常多的,他能在咱们网页中显示各种各样不同功能的按钮空间, 比如说同学们看右图所示的效果,在下面这个部分就给咱们展示了提交按钮,充值按钮以及普通按钮这三种相关的效果。 那我们接下来就来带他们去介绍一下我们不同按钮的标签组成以及代码的实现。那首先啊,咱这边所讲到的按钮都是影铺的这个系列标签下面的,所以标签名都是影 铺头这个标签,只不过他们的泰布属性值有一点不一样,比如说第一种咱们的提交按钮,他所对应的泰布的属 禁止叫做撒吧 mit 这么一个单词啊,提交你的姑娘就在于点击之后能把咱们用户所填写的数据呢发送过去,具体呢是发送给咱们后端的福气的 絕, 他所对应的功能就是能在点击之后让咱们的表单恢复成默认值,而不是去清空这一点。同学们注意一下, 最后一个普通按钮,他所对应的太部属性值叫做八成这么一个单词,这个普通按钮啊确实和名字一样非常的普通,他默认 是没有任何功能的啊,他的存在是为了配合咱们之后 gs 去使用的,所以咱们在气质班中只需要会这个形态就可以了。 好,说完了我们当前不同按钮的标签组成之后,接下来咱们就来通过代码的形式来去演示一下,那这呢是我们所讲到的下面一个部分叫做引破的标签的按钮形态。那咱们回想一下刚才咱们说了哪一些状态啊? 第一个叫做咱们的撒吧 mit 这么一个单词 submit, 他表示的是提交按钮的效果, 那这咱们写上个影铺特,把里面的属性值改成撒吧。 mit, 我们后来还讲到了一个叫做 resit 这么一个单词, r e s e t, 他的 效果就是重置的按钮来恢复表单的默认值的,我们这边写上应铺特,把它的值改成 reset 即可。 那最后一个按钮的种类咱们说的叫做。第三个是八成这么一个单词,他的名字叫做普通按钮,正如名字一样,他默认没有功能,非常的普通,需要后面配合 gs 来去使用。那这边咱们也写上银铺的,把他的太部署性值改成八成。 写到这咱们已经把三种不同的按钮都已经写出来了哟,来看最后的结果,咱们来去刷新。哎,网页中出现了重置以及提交的按钮,大家怎么会发现咱所写的最后一个普通按钮确实按钮的样子在这里了,但里面有默 的文字吗?哎,它里面默认是没有的,他普通到里面的内容都是不存在的,那么这个时候我们肯定是想让我们当前的按钮中显示一些文本,那怎么控制我按钮中所显示的内容呢?哎,我们 想控制引破的中所展示的内容,咱们可以通过这么一个属性叫做 w 属性来控制就可以了,咱们想让他显示什么文字,就在 w 中写什么样的内容就可以了。比如说咱们写上普通按钮即可, 写完了之后来看咱们的效果哟,此时来去刷新哎,文字就在这里了。那现在啊,咱们已经把三种按钮呢展示在咱们自己的网页中去了。那咱们最终来去验证一下他们的功能是否都能实现。第一个提交按钮呢?咱们可能需要到了剧烈班才会用上,那 这个怎么暂且不论,我们来看第二个重置按钮。重置按钮呢,它的功能是把我们当前的表单置为咱们的默认值,那 咱们来试一试哦,我们找到当前的昵称这一块,我写上一段内容,比如说,哈哈哈哈,当我点重置之后,恢复成咱们默认的状态,是不是应该是没有内容的状态啊?哎,那我此时点击重置一,点击他重置了吗? 哎,其实没有,那这里老师就要说一个注意点了,同学们小心哦,如果咱们需要去实现按钮各自的功能,他是存在一个应用的要求的, 如果需要实现按钮的功能,咱们需要配合字母标签来去使用。而字母标签如何去使用呢?咱们只需要用字母标签把所有的表单标签一起包 过起来就可以了。那这老师带同学们去演示一下哦,那么咱们在最上面写上一个 form, 这么一个标签写完之后按下看不见哎,就出来了一个标签,而且 fm 标签身上自带了一个 x 属性,这 属性呢,咱们到了距离班才会用到技术班,咱们先把它给删除掉好,删完了之后咱们会发现凤凰标签是个双标签,它内部可以用来包裹咱们的内容的,所以我们把凤凰标签的后半部分直接 ctrl ex 剪接, 放到咱们整个表单的最后的部分,把它给粘过来,那并且呢,为了咱们代码的规整,我们把它里面所包裹着的所有的内容全都框选住,按下键盘上的太部键有一个缩进,这样层级关系 更加的清晰一点。好,现在呢,老师就用缝标签把咱们所有的表带标签都包裹起来了,他们俩配合使用就能实现按钮的功能。同学们再来去看一下哦。老师来去刷新, 我在第一个文本框中输入咱们的内容,大帅哥,写完了之后,我们点击重置,看会不会恢复成咱们默认的状态哦,一点击, 哎,会不会恢复,恢复了呦。而且这边针对于重置按钮来说,老师需要强调一下,有同学可能之前会认为重置是把所有的内容全都清空掉,但其实并不是的, 你们会发现我点重置之后,咱们的性别包括爱好中的默认选中,像是不会把它清空的,因为咱们重置的功能其实是把它恢复成默认状态,这样描述可能会更好一点哦。 说到了这里呢,咱们已经把引破的系列标签中的三种常见的按钮状态已经说完了,相对于这三种状态来说,需要把我们三种不同按钮的太部的属性值需要记住。 首先题圈按钮叫做撒吧 mit, 重置按钮叫做 resit, 普通按钮叫做八层。而且 如果咱们想要实现我们每一种按钮各自的功能,我们需要使用放标签,把整个表单标签一起包裹起来,配合使用才是可以的。好,说到了这,咱们就把影铺的系列标签的按钮这个种类的效果已经就是王了呦。

就会来到下面,然后剧中的话呢,就是那个 center, 对吧? center 的话呢?呃,它可以有效果,然后最好呢大家是用这个 midio m i d d l e, 好,他也是行的,没有任何问题啊。 ok, 好,那么这里的话呢,就是我们控制里边文字的一个上下左右的展示,然后我们其实比较习惯的话,还是都让他居中,对吧?就是默认的这个 s thinner 就可以了啊,这是最常用的啊,就是都居中, 然后那我们平时的话去用这个效果的话,也就是这么多了,然后具体有多少个,这个随便了,其实就是你随便想要有多少个就有多少个就可以。 然后最后呢,我们再来说一下这个 caption 啊, caption 的话呢,它表示的是我们的这个表的名字啊,这个的话我们就叫做学生信息表,是吧? 那么 caption 呢,它会有这样的一个效果,就是放在我们的这个页面的最上边,这个就这样的居中,然后我们可以配合我们的那个 h 标签,比如说 h 三, 把我们的学生信息表呢,再包裹到这个 h 三里边,这样的话我们这个就可以居中,而且上下有一定的缝隙, 怎么样的话一个学生一心一表我们就做好了,对吧?呃,用起来呢不是很麻烦,当然了,因为我们再去使用这个信息表的时候吧,呃,他的宽高啊,大小啊都要咱们手动的去设置,然后你可以往里边再多加入,比如说再追入一些 tr, 对吧?这个是没问题的啊,我们随便多加几个, 因为我们的固定的高度已经设置好了,那么他这个表格的高度就会自动的缩减,看到了吧,就是会自动的缩减, 这个不就和一张 excel 一样吗?我们平时去用的话,也就是像这种的去用个 excel 做信息的展示啊。好,那么这里我们说完了以后呢,接下来我们再来聊一聊这个表格的合并啊。表格的合并呢,其实是说, 嗯,我在下面再给大家写一个表格。好吧,那这块叫表格合并的演示, 我在这里边呢给大家加一个 table 啊,我们保存以后呢,接下来把这个 boulder 还有这个宽度高度 cosplaying 都拿过来啊,我这个就省点事不再给大家敲了,我们去建一个普通的 t d 啊啊 t r 的 t d 吧啊,就在 t r 然后 t d 啊, 好,还是建一个三行三列的表格,只不过这个表格里边我们就不再给他加那个数据了。啊, 那我这边我们写一下叫表格合并啊,好,我们刷新啊啊,在他的下方对吧,然后我们让他分开一点的话,我们可以加这个 b r 的标签啊,就是换行嘛,那么就是监控号 b r 杠啊,我们稍微的多 copy 几个啊。 好,我们再来刷新一下啊。嗯,这边的话还是表格合并放到这了,学生信息表,嗯,他的话没有达到我想要的那个效果啊,我把这个表格合并删掉, 因为这里的表格和这个表格它相当于冲突了,大家看到了吧,那么这样的话呢,我们可以把上边的这个给大家全部注视一下啊,避免影响到我们现在的这个效果啊,是不是我的 table 标签放错位 对着来啊?啊,确实是,是吧。呃,那这样的话,我们把这个 table 标签放到这来,因为它这样的话就相当于包裹在那个表格里边了,所以它有这个问题是不奇怪的。然后这句话的话,我们再来表格合并啊, 好,改一下啊,好,那么这样的话不就可以了吗?对吧?我们把这两个表拆开,然后表格合并的话,我们还是用一个 capture 啊,就是放到这个, 然后 h 三标签啊,表格合并,然后 b、 r 呢,是让两个表格之间有一点缝隙啊,好,刷新。好,那么这个三个表的话呢,我们首先来说这个横向的合并,横向的合并呢,就是在一个单元格里边,对吧?啊,就是在这啊, 其实非常简单啊,那么横向合并就是把这个这三个 td 变成什么?变成一个 td 就行了,就把这个两个多余的 td 给他删掉,但如果我直接删的话,他这个没有合并过去,大家看到了吧?他这边是虚线的,就相当于这个没有了,所以说呢,我得把这个 这个东西往这边合并一下吗?所以说我们就是加一个叫 col s, p、 n, 你要合并三个,那么这一块就写三就可以了。好,我们再刷新, 你看它是不是就变成合并的一个效果了呀?那同理呢,如果你想要合并竖着的,对吧?合并竖着的,那么你就得找这个对应的 t d 啊,就得找这啊,比如 r、 o, w, s, p、 n 等于三, 那么你需要把剩下的这两个排第一的这个 t、 d 给他删掉,也就是最左边的三个 t d, 就这一二三,这三个给他合, 合并一下,好,那么他不就合并了吗?对吧?啊,就,其实就是这样的一个效果啊,然后那么这里的话呢,就是我们再去应用这种合并,然后合并的话就看你想要合并哪里,你就把哪一个多的那个 td 单元格给他删了,然后在上边加上你想要合并的数量就可以了 啊,你比如说我现在再把这个后面的这两个合并一下,好吧?那就应该找到我们的第二列的第三个,对吧?那就是 lwspn, 我想要合并,你跟他想要合并两个,合并两个的话我就得把下边的这个 td 给他删掉,对吧?那我们保存再来刷新啊。 好,那你看这两个是不是他就又没了呀?啊?这样就 ok 了吧。其实这个就是我们在去合并的时候,大家需要注意的点,就是你要合并可以,但是你要把多余的那个 t d 给他删掉 就行了。好,那么上边呢,就是我们学生信息表的一个最常用的状态,还有一个就是我们的表格合并,然后这两个功能呢,可以说是我们表格这一块 最常用的东西,好吧,然后这块的属性呢,相对来说比较多一些啊,又有 thtrtd, 宽度,高度,边框,边框颜色,还有这个背景颜色倒是没有给大家演示,是吧?那给大家再演示一下啊, 背景颜色就是可以给表格加个背景色啊,那么 bj color 我们设置成 blue, 好吧, blue 就是英语单词的蓝色嘛,所以说最终的效果就是一个蓝色的这个表格啊,好, 那么 alan 和 welan 属性呢?就是表格的对齐,然后接下来的单元格间距,单元格行距就是把我们的那个缝隙给它去除掉,然后那么合并的话, 那就是 cosplay 和 rospan 啊,那么来实现它的一个合并的效果。好,那么这里搞定了以后呢,我们这个整体的表格标签啊就都给大家讲完了,主要包含的就是我们表格标签的语法和它的一个使用方法, 然后这边都是表格这里边我给大家经典过的最常用的一些属性了,大家一定要把它们都记住。 然后一些不常用的呢,大家如果感兴趣的话,就可以咨询百度,或者查看我们的对应的 atm 手册也可以啊。然后不常用的我们在开发当中因为用不到,所以在这边我们就不再给大家多说。好的,那本节课我们关于 atm 的表格标签就讲到这里,同学们加油。

这节课我们来学习设置完样式的第二种方式,使用头部的 style 标签来设置样式,所有的样式代码写在 style 标签里边,这里就需要使用选择器来制定我们要修饰的元素。 这节课我们讲三个选择器, id 选择器、克拉斯选择器和元素选择器来看代码,这里我写了三个 a 十一作为今天的演示,看他们的默认样式 都是黑色字体,那我想把第一个标题改为蓝色字体,用 style 标签应该怎么做?来看一下 style 标签在这里, 那我怎么写才能把它的效果作用在第一个标题标签上?这里就需要用到选择器, 我们先使用 id 选择器, id 选择器可以理解为根据 id 来查找我们的元素。我把第一个元素的 id 命名为 开头一,我们知道 id 是他的唯一标识,其他的标签跟他不能有重复,所以 id 选择器设置的样式仅仅是对这一个来起作用。通过 id 选择器应该怎么写呢?来看一下。在这里 id 选择器以井号开头, id 的值 后边是画括号,下面就可以写我们的样式了。开了设置为蓝色来看效果,第一个标题变成了蓝色,那我想把第二标题也设置为蓝色,用同样的方式把这一段复制一下, 这里改成抬头纹。第二个他的 id 来看效果,第二个也变成了蓝色。我们会发现一个问题,如果有很多我们 都想设置为蓝色,如果都通过 id 选择器来设置,岂不是要写很多吗?另外一个选择器就派上用场了,克拉斯选择器来改下代码,把这些先去掉,给这两个元素都加个克拉斯属性,命名为胎头。 第二个也是这样的一个属性,克拉斯选择器,一点开头,后边跟克拉斯的直,同样是画括号,下面就可以写我们的样式,看了设置为蓝色来看效果,两个同时变为蓝色, 这就是他的优势。一个元素的卡死是可以有多个的,如果我们定了有一个 abc, 也可以写在这里。 如果想把这个页面上的 a 十一标签都设置为蓝色,那应该怎么做?可以使用 另外一个选择器,元素选择器。元素选择器是根据元素本身来查找,是这样写的,直接 a 十一,这样就对这一个页面上的 a 十一都起到作用。看一下效果, 三个标题都成为蓝色的,所以这种方式一般用的全局设置好了,这就是死带。要标签的使用方法其实也很简单,关键是选择器的使用。这节课就到这里,下节课我们讲样式的第三种设置方式。