CSS Border on three sides

问题:

If i want to have border on the three sides, do I need to declare border for each side eg.

border-left:1px solid green;
border-bottom:1px solid green;
border-right:1px solid green;

or is there any shortcut way?

回答1:

border: 1px solid green;
border-top: 0;

回答2:

Well, there is a slightly shorter way - but it's not what you'd call a shortcut...

border: 1px solid green;
border-top: 0;

Or you could declare partial elements which would allow for clarity:

border-color: green;
border-style: solid;
border-width: 0 1px 1px 1px;

回答3:

border:1px solid green;
border-top: none;

Note: I wouldn't do this myself, personally; it could be confusing to those reading it, and there's really no need. Although the original way involves repetition, it's minimal.

回答4:

You don't need to declare the border-top style and then override it:

border: 1px green;
border-style: none solid solid;

回答5:

this is a little shorter and does the same:

border:1px solid green;
border-top:0;