本文介绍了是否有一种方法可以继承CSS简写的一个元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述 29岁程序员,3月因学历无情被辞! 来自css新手的一个快速问题。我试图减少我的CSS文件的大小,通过使用简写的某些属性,如padding / marginins等。在某些情况下,我想要,例如,指定margin-top,margin-left和margin-bottom,但继承margin-right。我尝试了A quick question from a css newbie here. I'm trying to reduce the size of my CSS files by using shorthand for certain properties such as padding/margins/etc. In certain cases I want to, for example, specify margin-top, margin-left, and margin-bottom, but inherit margin-right. I triedmargin: 10px inherit 11px 12px;但不起作用,因为CSS inherit关键字继承所有或什么都不。but that doesn't work because the CSS inherit keyword inherits all or nothing.是否有一种方法可以将该标记标记为跳过,并执行Is there a way to mark that one as skipped and do something likemargin: 10px 11px 12px;margin-right: inherit;并且CSS知道我跳过一个4值速记中的一个值,作为一个3价值的速记?and have CSS know that I am skipping one value in a 4-value shorthand, and not interpret it as a 3-value shorthand?有没有人知道一个简单的方法来让这个工作?或者我应该只使用长手在我不指定所有四个值的情况下? 谢谢!Does anyone know an easy way to get this to work? Or should I just use long-hand in cases where I don't specify all four values?Thanks!推荐答案如果覆盖该值,最后一个声明将被忽略, :If you overwrite the value, the last declaration will be ignored, so you can just do this:element { margin: 10px 0 11px 12px; margin-right: inherit;} ...其中0可以是任何值  *...where "0" here can be any value  * see below.这不会按预期工作:margin: 10px 11px 12px;这实际上会产生这些值:That would actually produce these values:margin-top: 10px;margin-right: 11px;margin-bottom: 12px;margin-left: 11px; /* copied from margin-right's value since it's missing */ c $ c> inherit 采用应用于父元素的任何值,并且不会像通常所想的那样将其重置为默认。因此,如果它是 margin-right:100px 的直接子对象,它将继承该值。Just in case, note that inherit takes whatever value is applied to the parent element, and does not "reset" it to a "default" as is commonly thought. So, if it's an immediate child of something with margin-right:100px, it will inherit that value. It's a rare case you actually want to inherit a property like margin, you may be thinking it does something that it really doesn't. EDIT 这是一个罕见的情况,你实际上想要继承一个属性,如边际,你可能认为它做的事情, >:正如我在评论中所说,我不知道不能使用继承的速记(至少,为边缘),直到你带来这个问题向上。我在这里得到一些奇怪的结果,我真的不知道该怎么做: http://jsfiddle.net/ fpHb9 / 1 /EDIT: As I said in the comment, I wasn't aware of not being able to use inherit in shorthand (at the very least, for margin) until you brought this question up. I'm getting some rather strange results here, and I honestly don't know what to make of it: http://jsfiddle.net/fpHb9/1/因此,除非有其他人能够参与并更好地了解此行为,请小心处理。最好只是明确设置边距。So, until someone else can come along and provide a better understanding of this behavior, be careful with this. It might be better to just explicitly set the margin. EDIT2 :我想我解决了演示中的谜题。我没有引用的方便,但似乎因为 inherit 是无效的简写,使用它将使整个声明无效。所以像这样的东西将无法正常工作:EDIT2: I think I solved the mystery in the demo. I don't have reference handy, but it seems that since inherit is invalid in shorthand, using it will invalidate the entire declaration. So something like this will not work as expected:margin:20px inherit 20px 20px; /* this line gets ignored completely */margin-right:inherit;因此,修改我之前的声明:So, to amend my previous statement: ...其中,0可以是此处记录的任何有效margin width值: http://www.w3.org/TR/CSS2/box.html#margin-properties 。 ...where "0" here can be any valid margin width value as documented here: http://www.w3.org/TR/CSS2/box.html#margin-properties.原谅我长久以来的回答,你引起我的好奇,如何工作(或不工作)。Forgive me for the long winded answer, you aroused my curiosity as to how this works (or doesn't work). 这篇关于是否有一种方法可以继承CSS简写的一个元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云!
08-18 18:10
查看更多