Open children.html and save it as shorthand.html. You currently should have a div with borders styled with three lines of code. Those lines should currently look like this:
border-width:1px; border-style:solid; border-color:black;
Delete them and replace them with just this:
border:1px solid black;
The page should not change but you have saved some typing and download time.
At this stage I would suggest that you continue to write the CSS out in full because that is clear and less open to subtle errors. As you get better however you might want to reduce the amount of typing you do.
As another example in shorthand.html you have currently set the margins in one go with margin:5px;. This is effectively shorthand for this:
margin-left:5px; margin-right:5px; margin-top:5px; margin-bottom:5px;
View the page then change the single rule for those four and you should see no difference. Obviously the shorthand method is better and also simpler. However, if you want to set the margins differently this (try it):
margin-left:50px; margin-right:100px; margin-top:10px; margin-bottom:25px;
It is probably easier to follow than this (change it):
margin:50px 100px 10px 25px;
To use the shorthand version you need to remember that the styles start at the top and go clockwise.
You can do the same with padding so that and margins and borders would be a good place to start using shorthand CSS. Once you are used to that look for more on pages such as this from Mozilla or just pick it up as you go along.