问答详情
源自:8-8 我全都要 - 通用选择器

为什么*{font-size:20px;}和body{font-size:20px;}显示出来的字体大小不一样

578896b80001197505000162.jpg

578896b90001f75805000210.jpg

如图,这弄得我好难受

提问者:慕盖茨1361387 2016-07-15 15:55

个回答

  • lifeGWT
    2016-07-15 16:12:01
    已采纳

    因为*是通用选择器,可以匹配任何一个标号,自然包括h1标签;至于第二个用body作为选择器的时候,它作用于内层标签是通过继承得来的,遇到与内层标签的属性冲突的时候优先显示内层标签的,所以图二显示的是h1标签的默认字体大小

  • 稀饭DD
    2016-07-15 16:21:32

    body在这里是一个容器,就跟div一样,这个例子里面包含h1和p标签。直接对容器设置属性,容器内部的标签样式是整体变的(也就是说你不设置的话,h1自带属性决定它也比p大,设置之后,随容器一起变大变小)。

    *通配符,在这个例子里面相当于"body{xxx}   h1{xxx}   p{xxx}",对所有标签设置属性,因此“h1{xxx}”这部分将h1的样式重新设置了,h1的自带属性样式失效。

  • 么么哒3412913
    2016-07-15 16:13:38

    *是全文本是同一个字号大小,而各个浏览器对每种标记(比如p,h1,h2等等)预定义的大小都有所不同,但可以肯定的是都是相对值。
    也就是说对body指定一个font-size的绝对大小如12px,那么body的子元素p在未指定的情况下会使用浏览器预定义的font-size,举例说是medium或者1em,这时p的实际大小应该是12px;而h1(预定义可能是xx-large)实际就会是24px
    对body指定不同的大小,子元素会具有相应比例的大小
    要想统一所有的元素大小,可以通过这样指定:
    body,p,h1,h2,h3,h4,h5,h6 { font-size:14px; }

  • 西柚很芒
    2016-07-15 16:10:11

    *是对html里的全部定义,而前面改为body后就只对body内的有效,标题不会改

  • 慕粉15674945209
    2016-07-15 16:09:09

    *font-size:20px;相当于说是全部字体为20px,而body{font-size:20px;}是指body的字体为20px,所以勇气是以h1的大小显示

  • 啊B
    2016-07-15 16:09:01

    h1的原因吧,然后其他字体应该是参照物不同,所以看起来感觉变化了

  • 慕婉清6192078
    2016-07-15 16:06:38

    CSS就近原则。h1有默认的样式属性,根据CSS就近原则所以会这样

  • dubowen
    2016-07-15 16:06:06

    就近原则,h1重新定义了“勇气“的字体大小

  • 沉烬
    2016-07-15 16:04:47

    我感觉是因为“勇气”的字体大小不一样,所以整体看起来不一样?

    内容的字体大小是一样的吧!

    *改变了标题和内容的字体,body只改变了内容字体大小。

    刚学两天,错了勿怪……