00:00
啊属性啊,说一个样式叫什么呢?叫做一个display,哎,我们要说一下这个样式啊,这个样式我们单独拿出来说一下,说它干嘛呢?那作用是什么呢?那这里边我们先来整一个什么呢?整一个超链接,来一个井号,写什么呢?写一个我是一个这个大大的超链接,诶超链接,然后呢,我这写一个来什么呢?Style,我们说了我们这个超链接有一个理想,他希望什么呀,他希望他自己非常的诶,非常的大,来我写一个A,我来给他设置一个样式,来一个background color background color,来一个井号,呃,井号一个BFA吧,保存CTRL运行是不是一个超链接呀,但是现在我们这超链接能不能弹得上一个大大的超链接,就是太小了呀,那我来干嘛呢?我希望它大一点,大一点,我一想得了,咱们给他设置一个宽和高吧,位提设置一个宽和高,来一个Y,诶,咱们大大一点呗。
01:00
哎,500像素,哎,一个大大的超链接来一个hi一个什么呀,500个像素,我们想满足我们这个超链接一个一个愿望是吧?啊,一个愿望来我们这一刷新来走你走,诶我这刷新完了,他是不是也没用啊,诶这是为啥呀?哎,我们说了内联元素它是不是不支持这个宽和高啊,诶所以你这宽高你写5万他是不是也没用啊,哎,他也没用,但是问题来了,我们这个超链接吧,它就有这么一个愿望,希望它是一个什么呀,大大的超链接,那我们就想实现这个愿务,那怎么办?那我们说了,既然内联元素不支持宽高,那你这设置完了是肯定没用的,那它不支持宽高,我能不能干嘛呢?诶,我将这个A变成块元素的,诶或者说不一定将。
02:00
诶将一个什么呀,将一个内联元素干嘛呢?变成块元素,我把它变成块元素以后,它是不是就支持这个宽高了呀?诶那我怎么把它变成块元素,诶我这一说玛尼肯定不用是吧?诶肯定不管用,所以这里边我们得需要一什么呀,需要一个属性,什么属性呢?叫做一个第次play play什么意思呀?哎,显示的这么一个意思是吧?诶我们来说通过我们这个第次play属性这个样式吧,诶可以什么呢?可以修改我们的元素的一个什么呀,类型啊,简单来说就是一个类型,你可以干嘛呀,我可以将一个块元素改成一个内敛元素,也可以将一个内敛元素改成一个什么呀,块元素,诶那这个属性我们怎么用,我们来看一下,打开我们W3死顾离线手册,我们的这个HTMLCSSCSS参考手册,直接CTRL搜D。
03:00
还一个display在这呢,叫什么规定元素应该生成的什么呀?框的类型,框的类型现在我们简单理解就是什么呀,行内还有什么呀?块元素啊,行内元素还有块元素来诶打开我们这块,我们来看它是怎么用的啊display它的默认值叫做一个in inline,然后继承性是一个什么呀?No,诶,不会继承,然后我们来看它的可能的值来第一个值有一个什么呀,有一个,那我们先不管啊,我们先看我们要用的有一个什么呢?Block还有叫什么呀,阴烂,诶block还有一个阴烂,那block什么意思呀?哎,块的意思,In line是什么呀?行内的意思啊,行内意思,所以这里边我们来说一下它的这个什么呀,可选值。可选值我们来说第一个叫什么呀,阴缆为以什么呢?可以将一个元素作为什么呀,作为我们这个诶恒内元素或者叫什么呀,内联元素显示啊内联显示颜色显示,所以我这来一个第z play来一个什么呀,一烂我这一保存这什么效果呀,没变化为什么呀,它本身是不是就内敛呀,诶本身就是内敛,那我想改一个怎么办呢?来接着说这个值交易什么呢?B lock block它可以干嘛呢?诶可以将我们这个一个元素设置为什呀,设置为这个块元素显示啊b block的意思就是什么呀,就是块啊就是块,所以这会改一个改成什么呢?BCK,然后我这一保存咱们来看效果,现在一刷新来。
04:40
这怎么就知道它变成矿元素了,怎么知道变成矿元素了,我变成块了,我怎么知道它变不变块?哎,是不是宽高起作用,是不是就变成块了呀?哎,行不行啊,吓一跳吧是吧,来,我这一刷新来走。发现什么了,哎,发现我这个宽高是不是起作用了呀,哎起作用了,所以现在我们这个A就变成了什么呀,变成了一个块元素,而且确实是一个什么呀,一个大大的超链接,你看是不是整个都可以点啊,诶在哪都可以点啊,这么一个大的超链接,那它市块还体现在哪啊,它是不是得独占。
05:16
独占一行啊哎,独占一行,来我这写一个SPA哈,保存我们来看一刷新走,你SPA是不是跑这儿来了,哎,那现在这个A的确是一个什么呀,块元素啊块元素,所以block可以把什么呢?把一个元素设置为这个块元素显示,还有一个特别有意思的叫一个什么呢?叫做一个音。烂block in block in line叫什么呀?内block叫什么呀?那这连着来说叫什么呀?哎将一个这个元素嘛呢,哎转换为我们什么呀?哎行内块元素,那什么叫行内块元素,我们先看效果啊现在我们来说,当它是行内元素的时候,它是不是不支持宽高啊好,现在我给它变成什么呢?变成行内块啊行那块我们先看效果一刷新走你诶宽高支持不支持支持诶那我问你他有没有独占一行,Hello是不是过去了,哎hello过去了,所以什么叫恒那块啊说白了就是什呀,它可以哎使一个元素既有什么呀,既有糖内元素的什么呀,特点又什么呀,诶又有这个诶块元素的什么呀特点,诶既什么呢?诶既。
06:40
可以设置我们这个宽高干嘛呢?诶,又不会独占一行啊,又不会独占一行,所以这个阴line block干嘛呢?就是将我们这个元素设置为既有矿元素点,又有什么呀,又有行内元素点,那其实这种元素我们见没见过呀,最典型的我们说过有一个标签叫什么呀,MG标签,我们说MG标签是个什么标签,哎,是个是个内联标签,是内联压,是个内联元素是吧?哎,内联元素,但是我们说图片我能不能设置宽高啊,哎,可以设置宽高,所以图片啊f frame这种实际上就相当于什么呀,一个行内宽元素,既可以设置宽高,又不会独占一行啊,这是一个阴暗block啊行内块啊行那块好,然后这个说完了,我们再来说还有一个下边当然还有一堆呢,是吧,当然这一堆我们暂时用不上,我们用的时候再说啊,比如再说往上看,有一个叫什么呀,叫做那什么意思,诶叫什么。
07:40
那子元素不会被显示,那这玩意儿什么效果呢?来诶咱们看看叫做一个什么呀,那直接把它值给它写上,那保存直接看效果啊,我这一刷新来走你哎呦我这个A是不是消失的无影无踪了,诶来右键页面查看源代码,这个A在不在,在当然页面里干嘛了,是不是已经看不见了呀,哎已经看不见了,所以这里边那表什么呢?叫做一个隐藏元素,哎叫做什么呀,不显示元素,并且什么呢?并且你看我这个A1消失以后干嘛了,这SPA是不是就上去了呀,也就是说我这A还占不占位置了,哎不占位置了啊所以这个那表示什么呀,不显示元素,并且我们这个元素不会在我们这个页面中干嘛呢?继续占有什么呀?诶继续占有会诶人。
08:40
Play了干嘛呢?B份干嘛了呀,也不占了,就是就是一了百了是吧?诶一了百了走就走了啊这么一个效果display,诶那好,这是我们说display这个属性可以修改我们元素一个类型,简单说一下,In line设置为行内元素,Block设置为这个扩元素,In line block设置为行内跨元素,那么呢,就是不显示啊就是不显示,好,那我们来接着来说啊,那除了这个玩意儿还有一个属性,我们一块给他说一下,还有一个属性叫什么呢?和它有点像,我们来看看啊回退有一个属性在这儿,有一个叫做viibility viibility叫什么呀?叫规定元素是否可见,诶那我们说是否可见是不是,就是是否显示还是隐藏吧,诶显示还是隐藏,我们来看看visibility visibility,我们来看,诶,它的默认值是一个visible visible叫什么呀?可见的啊,继承性是一个什么呀?Yes,啊,会被继承,让我们来看它的可能的值,第一个值叫什么呀?Visible默认值元素是可见的。
09:40
还有一个值叫什么呢?叫做hidden,诶hidden叫什么呀?元素是不可见的,诶就两个值,Visible,还有一个hidden,下边这两值我们不用不管它,直接看这两个visible,还有一个hidden,那我们说了我的display那是不是也是隐藏呀,Hidden也是隐藏,那他们两个有什么区别?来诶咱们来看看吧,直接来写一个div,专门演示个事儿啊,Div给他点一个box啊,给他起一个class,然后我这来一个点一个box div给它来一个S,来一个100个像素,Hi来一个什么呀,100个像素,然后background color来一个这个orange奥,现在我们来看一刷新,出来这么一个100乘以100的这个div,对吧?好,那现在我来设置一个什么呢?设置一个display,一个那是不是隐藏呀,一保存咱们来看一刷新走,你是不是没了呀,哎,没了,所以我们来说没了,而且以后,而且我们说它的位置还占不占了,不占了啊,不占了,所以这里边我们。
10:40
他说使用D图档隐藏的元素,使用该方式隐藏的这个元素不会在我们这个页面中显示啊,不会在页面中显示,并且什么呢?诶并且不再诶占据我们这个页面的什么呀位置,哎,说白了他死了就干嘛了,直接就给他给他烧了,烧完了以时候是不是就没了呀?哎,就没了啊display一个那啊depend nu,然后还有一个值叫什么呢?刚才我们看了叫做一个viibility,诶visibility我们来说一下这个属性。
11:19
Visibility干嘛呢?可以诶用来设置我们这个元素的一个隐藏和什么呀,和显示的什么呀,状态,诶它有两个值,第一个值我们叫做一个visible vis我们叫什么呀?诶叫做一个默认值viible,这是我们这个诶默认值诶叫什么呀,元素默认会在我们这个页面中干嘛呀,显示啊,会在页面中显示,还有一个叫什么呢?Hidde叫做一个he叫什么呀,元素会。隐藏啊不不显示啊,不显示,那现在我设置微缩,我一刷新没有任何变化了,因为它就是什么呀,默认值,现在我改一个,改成什么呢?改成我们这个一来这回再看啊,诶我这一刷新走你哟,没了对吧,确实是没了,但是呢,这哈有没有上来呀,没有上来就说他虽然没了,但是位置干嘛呀,还站着啊还站着,所以这就是我们这个viible这个hidden一个特点什么使用我们这个visible hidden viible这个hidden,诶隐藏的元素,哎,虽然干嘛呀,虽然不会在页面中显示,哎,但是什么呢?但是它的这什么呀,它的这个位置会什么呀,会依然保持啊,会依然保持,也就是说它虽然没了,但是这地干嘛呀。
12:54
还站着啊,还站着那而我们黑的呢,没了就不是我们那个迪类,那没了就干嘛了,没了就没了,没了以后第二干嘛呀也不占了,而我们这个威黑的呢,依然占着这个空间啊,这是他们两个有区别,我们经常用这两个呢,去操作我们这个元素一个隐藏和显示,那用哪个呀?诶如果说你希望它没了就没了,死了,也就是消失以后不会再占据位置,就用什么呀,Dis display,那如果你希望什么呢?它虽然消失了,但是位置依然干嘛呀占据,你就用viibility hidden啊viibility hidden,好,这是我们说的这两个样式,我们来听一下。
我来说两句