美文网首页
继承和层叠

继承和层叠

作者: 源川 | 来源:发表于2019-04-09 16:38 被阅读0次

继承

CSS 中的祖先元素也会向后代传递一样东西:CSS 属性的值

有继承性的属性

1、字体系列属性

  • font:组合字体
  • font-family:规定元素的字体系列
  • font-weight:设置字体的粗细
  • font-size:设置字体的尺寸
  • font-style:定义字体的风格
  • font-variant:设置小型大写字母的字体显示文本,这意味着所有的小写字母均会被转换为大写,但是所有使用小型大写字体的母与其余文本相比,其字体尺寸更小。
  • font-stretch:对当前的 font-family 进行伸缩变形。所有主流浏览器都不支持。
  • font-size-adjust:为某个元素规定一个 aspect 值,这样就可以保持首选字体的 x-height。

2、文本系列属性

  • text-indent:文本缩进
  • text-align:文本水平对齐
  • line-height:行高
  • word-spacing:增加或减少单词间的空白(即字间隔)
  • letter-spacing:增加或减少字符间的空白(字符间距)
  • text-transform:控制文本大小写
  • direction:规定文本的书写方向
  • color:文本颜色

无继承性的属性

1、display

2、文本属性

  • vertical-align:垂直文本对齐
  • text-decoration:规定添加到文本的装饰
  • text-shadow:文本阴影效果
  • white-space:空白符的处理
  • unicode-bidi:设置文本的方向

3、盒子模型的属性

4、背景属性
5、定位属性

层叠

一个元素可能被多个选择器选中,因此会有多个规则,有可能以不同的值去设置同一属性。CSS标准会规定哪个优先级最高并生效, 称之为 层叠(cascade) 算法。

层叠规则

  • 层叠规则一:找到应用给每个元素和属性的所有声明。浏览器在加载每个页面时,都会据此查到每一条 CSS规则,标识出所有受到影响的 HTML 元素。
  • 层叠规则二:按照顺序和权重排序。
  • 层叠规则三:按特指度排序。
  • 层叠规则四:顺序决定权重。如果两条规则都影响某元素的同一个属性,而且它们的特指度也相同,则位置最靠下(或后声明)的规则胜出。

相关文章

  • 层叠和继承

    以上代码会让h1显示什么颜色?答案是蓝色。这就涉及到了CSS选择器的优先级(特异度)。 属性覆盖:优先级高的属性会...

  • 继承和层叠

    继承 CSS 中的祖先元素也会向后代传递一样东西:CSS 属性的值 有继承性的属性 1、字体系列属性 font:组...

  • 层叠与继承

    目标 学习层叠,优先级,以及css继承是如何工作的 css 层叠样式表 1 .某些时候发现一个项目中一些应该产生效...

  • 第三章、层叠和样式

    特殊性、继承、层叠 -> 解决样式冲突 1、特殊性 2、继承 3、层叠

  • CSS:属性继承、权重和层叠

    1、继承: 有一些属性,当给自己设置样式的时候,自己的后代也都继承上了该样式,这个就是继承性。那么哪些属性是能够继...

  • 慕课网HTML+CSS基础教程(9-10章)2.0版

    一、CSS继承、层叠和特殊性 1、继承允许某些样式继承到其后代子元素比如color可继承,border不能继承。2...

  • CSS三大特性

    CSS全称 Cascading StyleSheet层叠样式表 继承性 层叠性 优先级 继承性 1.什么是继承性?...

  • CSS继承,层叠,优先级

    CSS继承,层叠,优先级 继承 父元素设置样式,子元素可以继承部分属性 减少CSS代码 层叠 可以定义多个样式 不...

  • css继承、层叠和特殊性

    css继承、层叠和特殊性 1、继承css的某些样式具有继承性 那么什么是继承呢?继承是一种规则,它允许样式不仅应用...

  • CSS继承、特殊性和层叠

    1.继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标...

网友评论

      本文标题:继承和层叠

      本文链接:https://www.haomeiwen.com/subject/zvliiqtx.html