html-css特性和层叠以及外加继承

来，我们来看一下这个css三的特性啊，因为我们之前已经接触了大量的css吧啊那么它有哪些特性呢啊？三个，第一个呢是这个层叠性，啊第二个呢是继承性，然后第三个是优先性。我们先看第一个啊第一个层叠性。层叠性呢就是什么呢相同的选择器啊相同选择器给设置相同的样式，此时啊这个一个样式呢会去覆盖另一个样式。你敢很点样子啊。同样呢这边写的是啥呢相同的选择器啊，给同样的设置的话会覆盖啊。

那么这个呢那么在这里啊有一个啥冲突其实就是相。不同的样式啊。那么这个纯洁样式呢就是解决冲突的问题，比如说这个地方给个diy给了个红色，然后你又写了个diy，又给了个绿色啊，到底这个di用什么颜色？啊那么他遵循的就是我们的这个就近原则啊这个近呢是这个。啊那我们来写一下啊写一下。这个是我们的这个层叠或者说嗯沉淀性。因为我们有些时候写的多了，你可能就忘了啊。在同一个样式上面呢。嗯去出现重复的写的。啊重复写的你给这个dna写了一个这个字体，颜色是一个红色，然后呢你在某一个点，比如说你在这儿写了一堆对吧写了一堆，然后又在下面又去写，啊写然后这边开了给个这个绿色，那到底是用什么啊？

这个地方因为你只有两个颜色你只有两个选择器，你你一眼就可以看到。那其实开发会写很多哈，写一些你不小心在下面又给他添加一个，这样就会出现重复的现象重复的现象啊那么这个样式就会出现这个层叠哦，这个先打掉啊。先拿掉。然后这个地方呢就是呃后面的对吧会覆盖你之前写的，明白吧？这就叫做层叠，因为你中间可能还会放一些其他的样式。知道吗？啊这也是住院陈年啊。这是我们的第一个特性啊，层叠性啊，后面呢会覆盖前面的。

第二个就是继承。继承的话呢我们之前有提到过在css中啊这个子标签会去继承副标签的某些样式，哪些样式呢？比如说字体、啊颜色等等。啊比如说我们是给这个dna去设置的这个字体颜色啊、字体大小，那么你会看到p标签里面是不是也作用上啊。啊比如说我们这边来写一个吧啊写一个关于字体的这种啊，这个就是继承者恰当的去使用继承可以简化我们的代码，啊降低css复杂性。啊那么子元素继承复原素的样式有哪些呢？只要是t。开头的、啊放的开头的、那color开头的这些都可以被子元素计算，能懂吗？嗯我们来写一下啊继承。这是第一个覆盖继承。比如说我这边写个diy，然后这边去设置一个p标签，然后这边呢我们去随便写点内容。那这个会不会被稽查？用我用的是标签选择器，对不对？

那他会被继承吧。啊就是会继承，p标签也会继承啊。比如说这个示范标签，啊我们把这个呢放到这个地方来，示范标签呢也会去继承啊。这个你应该是外面应该也会去继承啊，这就是继承。啊。还有一些这个叫做方子，杠带。我们是给p它的副容器dna去设置了一个三十，那么p标签作为它的子标签会被继承，然后示范标签也会去继承副元素设置的字体样式，知道吧？啊就放大了。啊color对吧，方子赛啊，还有一些test对吧文本。

嗯嗯。接下来我们看一个叫做什么呢这个。嗯俱全。然后我们来看一下这个有时候呢是一个行高。待会儿我们看一下优先啊。优先级。在这个。地方的梵高。其实我们已经见过这样的写法了。啊如果你仔细看的话，以前我打开这个京东的时候，你应该看到过这种写法。这个行高的一个什么继承啊就设置一个行高它的一个继承性，这里有个叫做放的就是设置字体嘛、简写嘛，这里有个十二px，然后这边有个处理二点五，就有个杠二点五，然后后面是自己的类型。这里的设置行，高可以跟什么跟单位，也可以不跟单位，你可以这里写个ps，也可以不不设置。杭高。乙项目设的很高，就是蓝海很高。

那么如果子元素没有含高，则会去继承副元素含高的二点五。啊那么此时子元素的恒高是多少呢？当什么当前子元素这个当前子元素的这个大小是呃多大，去乘以二点五就行，就是此时的行高。嗯比如说我这边呢去写一下，嗯写下什么呢这个地方。嗯我这边再单独写一个，很高。这种呢也会被继承啊，比如说我这个地方有一个嗯因为啊或者说啊我这边写个叫做嗯这标枪。然后这边写一个，然后这边呢再来个dna。

好。三，标签。我先去掉啊所有的那个编剧啊，这个地方我先不去写吧先不写这个东西。啊我们经常会看到一个叫做什么呢嗯来去天涯p u d y这样的一个设备，啊一般我们看到b o d y可能是多一点。啊就在这里我们打开京东的这个网站。京东网站，鼠标右键检查，在这个地方找一下这个我们鼠标移到这个包的这个地方。你看这个boot这里是不是设置了一个叫做放大，对吧十二一点五。这是什么东西？就设置行高，啊十二，一点五，然后这边呢我们去嗯十二三就是字体大小。然后呢一点五呢就是行高的一个一点五。谁的一点五呢？拿十二乘以一点五。

我们先看一下，保存一下。我这边再加一个什么加一个字体。啊这个字体的话呢你可以用一下。这个雅黑啊这个叫做微软雅黑啊微软雅黑。啊拿过来。我就写一个，然后这边呢我们去查看一下，打开鼠标右键，嗯这点这个行高的行的高度。啊。嗯这里有一个字体，大小是十二。它的高度是多高呢？

嗯这里有一个十八，十八，这是它的宽度十八怎么来的？啊吃饭怎么来的？六，五，十二。这是十二伏，你把这个计算机打开是吧？十二乘以一点五，单一。哎清楚啊。十二去乘以一点五，是吧也就是说这里的高度它怎么来的呢？我不去设置的时候我给了一个broad。啊波折呢就是你看这是个p标签p标签。他继承了副标签的一个高度。哇这个批判的高度多高呢就是你这里的字体大小乘以一点五就是当前这里的这个高度。能懂吗？啊就是你不设置的话，那我这边去设置一个dna。

这个高度呢我写个三十点。啊应该我把字体设置下，方的sad，三十的价格，我把这个包的加起来。好，来看下这个diy它的行，高有多高。把它这个拿过来。这个地方有一个四十七，这个地方你看一下，这个是四十七，这个是宽度啊，后面这个是高度四十七。怎么来的？怎么来的？当前如果你设置了三十，三十去乘以个一点五，我们看一下等于多少？它有一个四十五。

啊那么这个地方呢会有一个两个像素的一个，嗯因为我加了个边框嘛，我把这个边框去掉边框去掉。边框去掉，因为你这里的边框也算能懂吗？这个地方高度是啊它是四十四十五，但是你这个边框一个像素，下面边框也一个。这样做，总共高度是四十七，我现在不加边框啊不加边框。就先把边框去掉啊，免得边框占占位置。来看一下是不是四十瓦。嗯能干嘛？你现在能明白了吗？这个的设置，如果我不去设置呢？如果你不设置这个diy的高度，就是你这个十二去乘以一点五就是当前这个行的高度，能懂吗？如果你设置了，啊你我不设置这个d m，你看一下这个高度是多少。刷新一下，鼠标右键检查。然后在这里你看他有个三十九点五，这三十九点五中来的。嗯方特塞这个地方，这多了来。把s拿掉，因为前面不然再多了个s。

三点。我们来看下这个，刷新一下啊，这里高度是不是十八这里高度是十八，十八怎么来的？就是你没有去设置的情况下是十二去乘以一点五，就是当前这个高度十八，你懂吗？如果你当前设置了这个字体大小，好，那请问这个行高是多少？就是你当前数字的字体大小去乘以一点五，能懂吗？啊这个就是四十五的一个高度怎么来的，因为你这里就是三十去乘以一点五，啊就是这个怎么去设置行高？啊杭高我没有单独去设个蓝海的杭高，而是在这个地方啊你会看到一个这种写法，你要知道它怎么去计算的。

在默认情况下，所有的行高，就字体大小是十二像素去乘一个二点五也行，一点五也行啊，这个都看你的要求啊。然后去乘一个当前二点五，就是当前这个字的一个行当。如果说你的子元素设置了字体大小啊字体大小，那你就拿你子元素的字体大小去乘以一个你这里设置啊这个值。就可以了，就能得到当前子元素的高度含高度，能懂吗？

嗯啊这个呢就其实也是存在一种继承关系继承关系。因为你这个p标签没有单独去设置高度嘛，那他就会去继承这个box设置的一个字体大小，并且呢去继承它的一个高度。这高怎么计算字体大小去乘以一个一点五，但你也可以写个二点五，能懂吗？也可以写个二点五，啊后面是要字体的一个类型嘛，后面是这。