搜索
热搜： 编程 Python Microsoft 编程语言 C++
首页> 前端开发 > Css3 > 正文

CSS中的inherit如何使用技巧小结

发布时间：2023-05-23 21:57:07 来源：网络
.
就让心静静地置于时光的一隅，用一片花香的暖，守候心灵的风景，正如世间每一种长久的缘都要悉心来呵护。经年后，那久久留存在心底的目光，是微细的心，是相知的暖。一梦许是无痕，一梦花又盛开。年复一年，碾过昔日的足迹，我的灵魂睡在那些温暖的文字里，与感恩和快乐相依，或喜或泣，皆是生活的一脉馨香。 "

稍不留意便会忽略掉级联样式表的特点。大多数开发者都知道inherit关键字，但有几个新的CSS3继承特性你可能不知道…
　property: inherit;

　　inherit关键字代表“使用指定给父元素的所有值”。如果父元素中没有明确的值定义，浏览器搜寻DOM树直到找到相应的属性。最终无法找到的话，它会使用浏览器的默认值，例如：

CSS Code复制内容到剪贴板
  1. #myparent
  2. {
  3. margin:10px;
  4. border:1pxsolid#000;
  5. }
  7. /*usethesameborderastheparent*/
  8. #myparentp
  9. {
  10. border:inherit;
  11. }

　　在实践中是很少有必要使用inherit的。许多有用的属性自动继承，例如字体，字体大小，颜色，等等。

　　inheritis可以放心地使用。尽管IE6和IE7不支持，但你的设计不会因为这个而被破坏。
　property: initial;

　　哦，一个新的CSS3关键词！initial设置一个属性为它的初始值——浏览器的默认定义值，例如：

CSS Code复制内容到剪贴板
  1. body
  2. {
  3. font-size:0.5em;
  4. }
  6. /*resetparagraphsto1em*/
  7. p
  8. {
  9. font-size:initial;
  10. }

　　它有用么？可能吧，毕竟你不能确保所有浏览器有相同的默认值。

　　支持合理——Chrome，Firefox，Safari和Opera 15 +。IE下它不生效，而且我正在努力思考什么情况下这将是一个灾难性问题。
　property: unset;

　　这是稍微不寻常的一个。unset使用时，它表现地就像有可继承值存在时继承了一样。如果它找不到可继承的值——比如，它是像box-shadow等不可继承的属性——它表现地好像继承了浏览器的默认值。

　　话又说回来，我想不出太多使用unset的场景，目前对支持它的很少。
　all: [ inherit | initial | unset ];

　　最后，all是一个属性而不是一个值。你可以指定inherit、initial或者unset来影响所有的属性，例如重置所有CSS属性为浏览器默认：

CSS Code复制内容到剪贴板
  1. #mywidget
  2. {
  3. all:initial;
  4. }

　　如果你添加了第三方控件且要避免页面样式冲突的话，这可能是一个可选的全局CSS域。

　　不幸的是，目前为止你不能依靠跨浏览器的严格的一致性，然而，它依然是一个有用的特性。

到此这篇关于CSS中的inherit如何使用技巧小结就介绍到这了。当你开始学会把说话变成一种成功的资本时，你一定能发现其实成功并不像人们所想的那样艰难。更多相关CSS中的inherit如何使用技巧小结内容请查看相关栏目，小编编辑不易，再次感谢大家的支持！

以下您可能有感兴趣的文章:
标签： 使用技巧 CSS
关于好代码 | 联系方式 | 版权声明 | 合作赞助 | 网站地图