CSS 边距和填充速记属性顺序的助记符

我总是记不住在一个声明中设置边距或填充的速记属性的顺序。那就是:

margin-top:    2px;
margin-bottom: 4px;
margin-left:   3px;
margin-right:  8px;

可以写成

margin: 2px 8px 4px 3px;

是的,我明白一个人可以通过想象一个时钟,从中午开始,顺时针方向移动来可视化顺序。但我总是忘记这一点。我需要回想一下文本中的顶部,右边,底部,左边的顺序。

因此,T R B L

像这样的[ R-名词][ B-动词][ L-名词]也许是可行的方法,但我觉得自己缺乏灵感。如果有人对此有什么有用的记忆法,我很乐意听听。就像一个好的文化基因一样,我确信一旦我的大脑里有了什么东西,我就不太可能忘记它。

28953 次浏览

If you don't get it right, there will be TRouBLe

It is

top
right
bottom
left

not what you have

Think Right Before you Leap

T R o u B L e.

Actually the clock thing works perfectly. It is the most intuitive way to remember it, at least for me.

Another attempt:

Tyrannosaurus Rex : Big Lizard

Tricky Rectangle Border Logic ?

Just think clockwise, it's the easiest way. Starts at the top and goes around... much easier to remember than some silly phrase (provided you know how to read a clock...)

Try Roast Beef Leftovers ?

Think that you're reading Arabii or Hebrew: read from the top of the page, right to left to the bottom. ;P The good thing about this "rule" is that it works for the 3 value version too: top right-and-left bottom

Actually, i allso thought it was hard to remember, but as soon as I discovered it was the direction of the clock it was easier.

Timewise Rotation, Bit Lame?

The Really Big Lebowski

"Top,Right,Bottom,Left"
Really
Bad
Limerick

Theres always the town of TRumBuLl Connecticut

Why don't just remember that the order goes clockwise starting from the TOP:

TOP -> RIGHT -> BOTTOM -> LEFT

*T*op *R*amen, *B*ottom, *L*unch

TRouBLe is best for me. And if only 3 values are shown, it's Top, Sides, Bottom - which for UK users spells TSB (the bank the government had to bail out using our money) - so TRouBLe and TSB are closely linked!

TROUBLE is always a secondary reminder for me, since I first think of the clockwise direction but might need to remember where you start; however, the 3-value shorthand was always confusing me until I realized the middle, (or second) value needs to represent two values (the sides). So, three values - the 2nd being 2 values - helps me remember that.

Remember driving lesson:

Turn Right Before Left

The clock trick works for the 4 number shortcut, but is there any logic to the 3 and 2 number shortcuts? 1 number and it applies to everything, and that makes sense, but

1 = (T/R/b/l)
2 = (T=b) (R=l)
3 = (T) (R=l) (b)
4 = (T) (R) (b) (l)

It just doesn't seem logical at all. But... First value pertains to Top, Second pertains to the Right, Third is the bottom and Fourth is the left; A number is not specified if it's the same as its opposite. Horizontal and vertical MUST be declared unless all values are identical.

In other words, you always specify the Top and Right values, bottom and left fall in as required.

If you're old enough to remember the original Star Trek TV series (you know, with Capt Kirk), well first of all, you're too damn old. But there is "The Trouble with Tribbles" episode. Both nouns in the title work. I've used that in the past, but also prefer the clock analogy.

Whenever you strike with a given situation, just think of a clock-wise rotation i.e., way the clock rotates from 0 to 60 in a circular rotation.

Clock thing is easier to remember than the word TRouBLe (as marked answer) in my opinion since the word trouble belongs to English language and all those minds native to English language might find it easier to remember the word TRouBLe in relevancy to the given situation but not others who only use English language when they really have to.

Same is not true with clock-wise rotation of a clock, when it comes to remembering something (as asked it the question) since clock-wise-rotation is a very well-known phenomena world-wise.

A few abbreviations (one may consider the one which sounds familiar):

  1. TROUBLE (TROUBLESHOOT,TROUBLESOME)
  2. TERRIBLE
  3. TRIBBLE
  4. The Royal British Legion
  5. Tobacco Road Basketball League
  6. Temporary Revenue Borrowing Limit
  7. Transformational Rule-Based Learning

T he

R omans

B rought

L atin

(among some other things...).