CSS哪些属性可以继承哪些不可继承与 CSS优先级算法

lemanli 发布于2019-08-30 15:56 / 2796人阅读

摘要：哪些属性可以继承哪些不可继承可继承属性字体系列属性组合字体规定元素的字体系列设置字体的粗细设置字体的尺寸定义字体的风格偏大或偏小的字体文本系列属性文本缩进文本水平对刘行高增加或减少单词间的空白增加或减少字符间的空白控制

CSS哪些属性可以继承哪些不可继承

可继承属性：
1.字体系列属性
font:组合字体
font-family:规定元素的字体系列
font-weight:设置字体的粗细
font-size:设置字体的尺寸
font-style:定义字体的风格
font-variant:偏大或偏小的字体
2.文本系列属性
text-indent:文本缩进
text-align:文本水平对刘
line-height:行高
word-spacing:增加或减少单词间的空白
letter-spacing：增加或减少字符间的空白
text-transform:控制文本大小写
direction:规定文本的书写方向
color:文本颜色
3.元素可见性
visibility
4.表格布局属性
caption-side定位表格标题位置
border-collapse合并表格边框
border-spacing设置相邻单元格的边框间的距离
empty-cells单元格的边框的出现与消失
table-layout表格的宽度由什么决定
5.列表布局属性
list-style-type文字前面的小点点样式
list-style-position小点点位置
list-style以上的属性可通过这属性集合
6.引用
quotes设置嵌套引用的引号类型
7.光标属性
cursor:箭头可以变成需要的形状

不可继承属性
1.displey
2.文本属性
vertical-align:垂直文本对齐
text-decoration:规定添加到文本的装饰
text-shadow:文本阴影效果
white-space:空白符的处理
3.盒子模型属性
width、height、margin 、margin-top、margin-right、margin-bottom、margin-left、border、border-style、border-top-style、border-right-style、border-bottom-style、border-left-style、border-width、border-top-width、border-right-right、border-bottom-width、border-left-width、border-color、border-top-color、border-right-color、border-bottom-color、border-left-color、border-top、border-right、border-bottom、border-left、padding、padding-top、padding-right、padding-bottom、padding-left
4.背景属性
background、background-color、background-image、background-repeat、background-position、background-attachment
5.定位属性
float、clear、position、top、right、bottom、left、min-width、min-height、max-width、max-height、overflow、clip、z-index

CSS优先级算法

1.原则
使用就近原则，同权重情况下样式定义最近者为准
载入样式以最后载入的定位为准

2.优先级
同权重下：
内联样式(标签内部) > 嵌入样式表(当前文件中) > 外部样式表(外部文件中)
！import > id > class >tag
备注：important比内联优先级高

作者有话说

亲爱的读者：
每日两道前端面试题专栏目此后不再以此为标题.
关于日期会写在文章的最后.嘻嘻
每日两道前端面试题20190306

GPU云服务器云服务器继承与多态 python类与继承 css属性访问CSS属性

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/117489.html

前端硬核面试专题之 CSS 55 问

摘要：前言本文讲解道前端面试的的内容。文章原文地址前端硬核面试专题之问。前端硬核面试专题的完整版在此前端硬核面试专题，包含数据结构与算法。 showImg(https://segmentfault.com/img/bVbv2GE?w=900&h=400); 前言本文讲解 55 道前端面试的 CSS 的内容。复习前端面试的知识，是为了巩固前端的基础知识，最重要的还是平时的积累！注意：文章...

崔晓明 2019-08-30 15:44 评论0 收藏0
前端面试经典题目汇总（持续更新中）

摘要：只要没有被覆盖的话对象原型的属性就能在所有的实例中找到，若整个原型链未找到则返回如何实现继承构造继承原型继承实例继承拷贝继承原型机制或和方法去实现较简单，建议使用构造函数与原型混合方式。 HTML相关问题 1.XHTML和HTML有什么区别 HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的标记语言最主要的不同：XHTML 元素必须被正确地嵌套。XHTML 元素必须被...

BigNerdCoding 2019-08-29 11:32 评论0 收藏0
前端面试经典题目汇总（持续更新中）

摘要：只要没有被覆盖的话对象原型的属性就能在所有的实例中找到，若整个原型链未找到则返回如何实现继承构造继承原型继承实例继承拷贝继承原型机制或和方法去实现较简单，建议使用构造函数与原型混合方式。 HTML相关问题 1.XHTML和HTML有什么区别 HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的标记语言最主要的不同：XHTML 元素必须被正确地嵌套。XHTML 元素必须被...

Warren 2019-08-20 12:18 评论0 收藏0
前端面试经典题目汇总（持续更新中）

摘要：只要没有被覆盖的话对象原型的属性就能在所有的实例中找到，若整个原型链未找到则返回如何实现继承构造继承原型继承实例继承拷贝继承原型机制或和方法去实现较简单，建议使用构造函数与原型混合方式。 HTML相关问题 1.XHTML和HTML有什么区别 HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的标记语言最主要的不同：XHTML 元素必须被正确地嵌套。XHTML 元素必须被...

Tony_Zby 2019-08-01 15:57 评论0 收藏0
IMWeb前端提升营七天学习总结

摘要：写在前面月到这天，前端提升营，腾讯大佬们分享个人经验，使出各种前端方面的大招。并且减轻服务器的负担，的原则是按需取数据，可以最大程度的减少冗余请求和响应对服务器造成的负担。控制表单控件的禁用状态。写在前面 5月24到30这7天，IMWeb前端提升营，腾讯大佬们分享个人经验，使出各种前端方面的大招。从中学习了很多前端方面的知识，也get到了前端学习的方法论，还有一些算法知识等等。现将...

mating 2019-08-20 16:59 评论0 收藏0