尚硅谷前端基础 (81)

好，我们接着来说字体，那关于字体的话，其实最常设置的就是fo size，还有我们的这个，还有我们这个found family，那接下来我们来说一个这个字体的一个简写属性，字体的一个简写属性啊，所谓简写属性就可以同时设置我们这个字体的所有样式，对吧，我们在这直接写一个这个写一个div div，我们这写一个今天天气真不错，哎，Hello，然后来一个hello，跟刚才那一样啊，跟刚才一样，那这里边呢，我们来打开一下啊，还是我们给它设置一个哎，基础的样式啊，我们style，我们这直接来一个这个div div的话我们给它放，哎，我们给它直接设置一个这个borderder啊，Borderer我们来一个这个EPXRA，然后来一个solid啊solid，那这里面我们来说一下，我们叫做简写属性，叫做一个放放呢，它可以什么呢，它。

可以设置我们字体相关的所有属性啊，可以设置我们自体相关的所有属性，比如说我们刚才讲的fo size，还有found family，我可以怎么写呢？我们之前的写法，可能我需要这么写，我需要写一个这个fo，哎，Fo size font size，比如说来个50个像素，然后呢，我再写一个放到family，放到family呢，我们就我们就随便写一个吧，随便写一个，哎，用我们这个衬线字体是吧，那大概就这么一个项目，这个是我们之前的写法，我是不是等于把这两个属性分着写了，那简写属性就可以指的是同时设置两个属性，那怎么设置直接写，我们直接写一个叫做一个放就叫放啊，比如说我想指针大小，我来一个50像素，然后空格，我再把这个字体干嘛呀？哎，我给它粘过来。Ctrl c e保存，那这个时候其实我这行代码跟上边那个是等价的啊，是等价，所以你要看我把它注了，我写它。

效果是什么？哎，效果是一样的啊，这两个是等价的啊，效果是一模一样的，没什么区别，所以这个就叫做一个简写属性啊，放的可以设置我们自己相关所有的属性，那这里边我们来说一下它的一个事例，事例就是什么？哎，它的一个语法吧，语法就是什么呢？就是放，哎然后呢，跟的是我们第一个跟的是我们字体大小，后边是我们这什么呀，字体足一定注意顺序，先写的是字体大小，然后写的是一个字体足，它们之间用这个空格隔开啊，字体足一定要写到最后，而字体大小写到倒数第二个啊，写倒数第二个，那这里边其实除了这种写法，我们还可以怎么写呢？我还可以这么写，我可以直接在我们字体大小这后边，我跟着一个鞋盖，鞋盖我来什么呢？二这表什么意思呢？哎，我在字语大小后边还可以同时指定我们的一个行高啊，还可以同时指定这个行高啊，这是可选的对吧？写不写都行，你不写也OK。

啊，写上呢，就是该是多少就就是多少生命效果，懂这意思吧，哎，可以再多加一个横高，那这里边注意一个问题啊，一个问题我们来看一下，现在呢，我在这写一个行航高，我来一个烂hat，我来一个两个像素啊两个像诶两倍的航高，两倍的行高，但是你注意很明显，我现在住了，现在这个两倍的航高是生效的，对吧，两倍航高是生效的，所以在这儿我如果写成50像素，但是你这时候看两倍航高升没生效，没生效两倍行高是不是应该是应该是这个效果呀，哎，这个效果也就是说现在它并没有生效这个两倍行高，那这个时候我们来说一下这是为什么，这是为什么？这是为什么？哎，注意了，我们这个行高可以省略不写，行高可以什么呢？可以省略不写，可以省略不写，注意了，你省略不写并不意味着不设置，如果你看这我现在没有写行高，没有写行高相当于我写了一个1.33，你看我不写。

别写了一个1.1.33还不行，这应该是三个三吧。我们来看一下啊，它这个默认值是多少。哎，那它这块默认值我就先不去测试了，我们来看一下吧，我们看看能不能看到这个默认值啊，我们直接检查一下，选中这个元素，我们看一下它的样式，行高的话是是这个值，这个值的话我们来看一下它的一个样式的渲染。Lihet liht是一个normal，是不是一个正常值啊，哎，正常值，那现在等于说，哎不管它是什么值，但是它是不是就没有用到我们的那个二啊，哎，没有用到这个两倍含高，也就是说可以省略不写，注意如果不写，如果不写它会什么呢？会使用这个默认值啊，会使用默认值，这默认值应该还不是我们那个1.33，因为我我设置完1.33的话，它应该。

我看一下啊，把1233给它去掉。哎，我说1.33可能稍微有点大，所以默认值应该也不是1.33，那这个默认值我们就不管是多少了，总之它肯定不是这个二，所以这个时候如果你不写行高的话，它实际上会把之前那个行高也给覆盖掉，所以这样的话，如果你还想确保是一个两倍行高的话，你最好这显示的把这二给写上，才能确保不把之前那个覆盖，所以注意啊，你这块你用fo去设置字体的时候，你这个行高省略，省略不意味着不写省略，不意味着不写省略。是使用默认值，所以省略的话，会把前边这个给它覆盖掉，或者你也可以把这行高干嘛呢？你可以把它写到后边，这样也可以去解决这个问题，懂这意思吧？哎，这是我们说的一个fo family啊，Fo简写属性啊，简写属性那除了我们的这个这么写的话啊，我们来把它注掉，我写上面这个啊，在上面的演示，我这直接写了一个两倍行高，除了可以写这两个属性以外，我们还有一些属性也可以写前面啊，那注意顺序的话，这两个属性必须得在最后啊，字体大小是倒数第二个，这个必须得是倒数第一个，而且这两个是必须写的，这两个是必须写的啊，一定注意字体大小和字体足是必须写的，缺一不可，但是前边我还可以写些别的，比如说我可以写一个bold，哎，我再写什么呢？我再写一个这个Italy，哎，Ital里那这样你就很明显能看出来bold表示什么意思呢，你看我字体是不是加粗了，哎加粗了一。

Italic表示什么呢？表示斜体，这两个你写不写都行，你把italic写前边。

也行，顺序无所谓，然后这个这个写不写呢，也都无所谓啊，这是这两个东西，这两个东西我们单独再说一下，我们来一个nt set font size，我们来一个50像素啊，50像素实际上他们也有单独的属性，我们的加粗，我们叫做一个fo white fo white，我们叫做自重是吧，自重字体的一个重量啊外。这是设置我们这个自重啊，其实说白了就是我们这个字体的什么呀，字体的一个加粗效果啊，字体加粗一般的话，我们用的值就是用的是一个Bo啊，就是用一个Bo，那这样是不是就加粗了，哎，这样就会得到一个加粗效果，诶刚才我这个加粗我怎么觉得不明显呀，我们来看一下。啊是字体的原因，因为我们这儿是不是用的是默认字体，用的是微软雅黑啊，你这要加粗的话，你可以要加一个字体，我写一个微软雅黑，然后逗号，哎，这样这加粗是不是就比较明显了啊，这是字体原因啊，跟那个没关系，好换过来我们这来一个放到外头，我们叫一个Bo，不要表示的是一个加粗，如果你不写，那就是正常情况，写上就是一个加粗，那这里边我们除了这个bold以外的我话，我们还有一些其他值，其他值我们有什么呢？有是不是有一个normal啊，Normal表示正常就是不加粗啊，不加粗啊，我们来说一下可选值。

可选值我们叫做一个normal，哎，Normal这是我们一个默认值啊，默认值不加粗啊，不加粗，然后还有什么呢？Bo这个表示的是一个加粗，一般我们用的话就用这两个值啊normal还有bold，但是实际上它给我们提供了100~900，九个什么呢？哎，九个这个级别，九个级别。

九个级别，这表示我们九个加粗的级别，比如说我可以写一个这个一百一百，那可能就是最细的了，对吧，最细的了，然后写一个200，哎，这是第二级别，300第三个级别，400第四个级别，哎，500第五个级别，600第六个级别，但是你会发现，其实你会发现一百两百，300 400 500。哎，到600台变化是不是前边一到100~500效果都是一样的呀，哎，效果都是一样的，所以啊，这里边我们来说一下，这个放到外的，虽然给我们提供九个级别，但是这玩意儿它基本上没什么用，没什么用，为什么没什么用呢？为什么没什么用呢？因为这里边我们说了，为什么我们这个字体能加粗，为什么那我的字体一旦能加粗，那一定意味着我用户的计算机里存在着不同版本的字体，它肯定存在一个什么呢？比如说微软眼黑，我能加粗，一定存在着一个比较细的微软眼黑还存在着一个粗一些的，哎，100的还存在一个200的，还存在一个300的，就是说你能之所以能加粗，是因为你的计算机里存在有正常的字体，还有一个什么呢？还有一个加粗版的字体，对吧，一定是存在多种字体，那这个时候我给他分了九个级别，一百二百三百四百五百六百，700，八百九百，那这样是不是说我所有。

人的电脑里都会装这么多级别的字体，比如说你会不会装酒九种不同粗细的微软雅黑呢？哎，一般不会有人这么做的，所以这种情这个东西就是极特殊的情况才会用到，一般情况下我们都不用啊，我们都不用，因为你用一百二百可能是一样的啊，所以这个100到九百九个级别当中呢，它是一个什么情况，200可能比100粗。诶，可能比100粗，但是不一定最低，最低200和100是一样的，它可能比100粗，懂这意思吗？也就说高一个级别可能比他粗，但是不一定，这要依据什么？依据你这个计算机里面这个字体的一个数量，所以这个东西一般不用，我们用的话，要么就bold，要么就no，加粗就是Bo，不加粗就是normal，就这个东西啊，这是加粗，然后还有一个我们叫做foundsty foundstyle也是一样，我们直接简化来说了，哎，两个值，一个叫做normal normal就是正常的啊，正常的还有一个我们叫做什么呢？叫做一个italic italic表示的是一个斜体啊，表示的一个斜体。

不多说了啊，不多说了，哎，Foundstyle这个是我们的一个字体的一个这个样式，自己一个风格啊，自己一个风格，我们这个normal normal表示的是一个什么呢？正常的，哎，正常的，然后我们这个italic italic表示的是一个斜体啊，斜体不多说了啊，不多说了，然后再回到我们上边这个话题，我们这个放的属性可以同时设置我们这些字体相关的一些样式，包括我们的这个found外，还有found stylele，所以像我们上边这种，像我们上边这种，你看这。

哎，你看我是不是就同时设置了以al这个同时设置bold呀，但是这两个啊，我们可以省略不写，以al这个bold都可以不写，但是我们来测试一下，如果不写它是真的不写，还是会有一个默认值，怎么测试，我在上边呢，我给他写一个found found我给他写一个Bo，也就是我先写一个加粗，然后在这我不写，你看它加粗效果还有没有了，没有了，也就是说实际上你这么写相当于什么呢？你省略了那个斜体，省略那个加粗，实际上相当于这写了一个normal normal就是正常的，也就是说等于这个值把上边那个值给它覆盖掉了啊，这个值把上边那值给它覆盖掉了，所以这个时候你这儿如果是写成一个Bo的，哎，就可以得到一个加速效果，你要不写等于什么，等于又被覆盖掉了，所以你要注意这些属性都是啊，这些简些属性默认情下都是，如果你对它进行省略了，省略了并不是不写，省略了也写了，只。

不过它用的是默认纸啊，用的是默认纸，好，我把这个版本给你留下，这个比较简单啊，我们就快速的说一下，待会自己来试一下，我就不多说了啊，这东西再说也没什么，没什么太大意义啊，那关于自己的样式，我们就先说这么多，那实际上还有一些其他样式，我就不再去过多的说了，因为其他样式我们用的也不多，你要想看的话，感兴趣的话在这直接搜一下，直接缩放的啊，所有放的相关的什么face呀，Style啊，Family啊，White啊，什么display啊，乱七八糟的一些东西，是不是都给你列出来了，感兴趣自己看一下，不感兴趣可以先不管它，因为大部分情况下也都用不上。好自己的样式我们就先暂时告一段落，停一下。